Question

有一个要求，即从后端检索一些包含HTML标签的消息，以及如何正确显示HTML标签而不显示原始标签字符。

如下所示的消息（以引号显示）：

"This is a <a href="#">link</a>, for a test."

右显示：

“这是link，用于测试。”

Answer 1

似乎您希望将字符串显示为html。您只需要将其添加为innerHTML。不是innerText或textContent

显示错误

let str = `This is a <a href="#">link</a>, for a test.`
document.body.innerText += str;

右显示

let str = `This is a <a href="#">link</a>, for a test.`
document.body.innerHTML += str;

如果要在字符串周围使用引号，请使用Template Strings

let str = `"This is a <a href="#">link</a>, for a test."`
document.body.innerHTML += str;

Answer 2

您可以为此使用innerHTML。

示例：

document.getElementById(id).innerHTML  = yourTextWithHtml

Answer 3

您可以使用document.write（）呈现HTML

document.write(`This is a <a href="#">link</a>, for a test.`);`

但是要追加现有的HTML字符串，您需要获取要在其下插入HTML字符串的节点/标签的ID。

有两种方法可以实现此目的：

使用DOM-

var tag_id = document.getElementById('tagid'); 
var newNode = document.createElement('p');
newNode.appendChild(document.createTextNode(`This is a <a href="#">link</a>, for a test.`)); 
node.appendChild(newNode);

使用innerHTML-

var tag_id = document.getElementById('tagid'); 
tag_id.innerHTML(`This is a <a href="#">link</a>, for a test.`);

您还可以使用jQuery html解析器执行以下操作：

var html =  `This is a <a href="#">link</a>, for a test.`;
html = $.parseHTML( html);
$("#tagId").append(html);

我希望这会对您有所帮助。谢谢

Answer 4

转义-

您应该转义在字符串中找到的所有引号。将\放在它们前面可以逃脱。

console.log("This is my string with quotes \" \" ")

如何显示字符串中的html标签？

4 个答案:

显示错误

右显示