将 JSON \n 转换为 HTML <br> 标签
Posted
技术标签:
【中文标题】将 JSON \\n 转换为 HTML <br> 标签【英文标题】:Convert JSON \n to HTML <br> tag将 JSON \n 转换为 HTML <br> 标签 【发布时间】:2017-01-15 22:58:09 【问题描述】:我一直在使用 YouTube A.P.I. 开发一个网站
在 JSON 文件的 description
标记内是换行符 \n
我需要将这些标签转换为 html 格式
VideoDescriptions.push(item.snippet.description);
["Example description\nPlease click the link", "Another example description\nMore info"]
编辑:
这个问题不是链接文章的重复,因为:
它使用 YouTube API 来检索数据 必须从数组而不是字符串进行编辑(如 文章中描述) 任何一个问题的答案都可能导致不同的结果和 可能不适用【问题讨论】:
javascript replace \n with <br />的可能重复 【参考方案1】:你可以简单地在javascript中使用字符串replace
:
var items = ["Example description\nPlease click the link\n\n", "Another example description\nMore info"];
console.clear();
var changed = items.map(i => i.replace(/\n/g, '<br />')).join('');
var div = document.querySelector("#test");
div.innerHTML = changed;
<div id="test"></div>
【讨论】:
猜猜我只是使用替换标签错误,谢谢你的回答!【参考方案2】:有趣的是,如果您通过 .innerText 而不是 innerHTML 设置标签的内容。 所有的\n字符都会为你转换成标签。
例如:
document.getElementsByTagName('h1')[0].innerText = '带有\n换行符的新文本。'
【讨论】:
我不需要将它应用于数组中的每个字符串吗? 我的意思是你可以保持所有字符串不变,当你想在页面上输出它们时使用innerText。 我明白了。使用.innerText
还有其他优势吗?
它做它该做的事。在你的情况下它很方便。【参考方案3】:
您可能应该从每一行创建单独的节点,而不是使用<br>
,因为它提供了更大的灵活性。你可以这样做:
var description = ["Example description\nPlease click the link", "Another example description\nMore info"];
var fragment = description.reduce(function (frag, line)
var parts = line.split('\n');
var container = document.createElement('div');
var firstLine = document.createElement('p');
var secondLine = document.createElement('a');
firstLine.textContent = parts[0];
secondLine.textContent = parts[1];
secondLine.href = '#';
container.appendChild(firstLine);
container.appendChild(secondLine);
frag.appendChild(container);
return frag;
, document.createDocumentFragment());
document.querySelector('.parent').appendChild(fragment);
<div class="parent"></div>
这里我们获取描述并将其简化为documentFragment,其中包含一个容器元素,描述数组中的每个项目都有两个子元素。
使用textContent 之类的方法将阻止 XSS 攻击向量(即使描述在您的控制范围内,也不要为了好玩而创建可能的 XSS 漏洞)。
【讨论】:
【参考方案4】:您可以使用javascript替换功能,并根据您的需要替换项目:
String.prototype.replaceAll = function(search, replacement)
var target = this;
return target.split(search).join(replacement);
;
var test = ["yes, this is my example\n", "goodbye"];
console.log(test[0].replaceAll('\n', '<br>'))
【讨论】:
以上是关于将 JSON \n 转换为 HTML <br> 标签的主要内容,如果未能解决你的问题,请参考以下文章
org.json.JSONException:java.lang.String 类型的值 <br 无法转换为 JSONObject