如何在 HTML 和 Javascript 的动态列表中显示格式化的 HTML 文本
我想在我的 HTML 动态列表中显示 HTML 格式的文本。但是，显示的不是格式化文本，而是 HTML 标记。这是代码片段
<!DOCTYPE html>
<html>
<body>
<ul id="myList">
<li>Tea</li>
<li>Milk</li>
<li>Water</li>
</ul>
<p>Click the button to create a LI element.</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
var x = document.createElement("LI");
var t = document.createTextNode(" I like <i>Coffee</i>");
x.appendChild(t);
document.getElementById("myList").appendChild(x);
}
</script>
</body>
</html>
单击 Try it 按钮，您将观察到我得到的不是格式化的 HTML，而是在咖啡前得到斜体标签
代码有什么问题？
达令说浏览 56回答 1
1回答
-
翻过高山走不出你
除了使用createTextNode，您还可以innerHTML在元素上使用来添加包含 HTML 元素的文本，例如： var x = document.createElement("LI"); x.innerHTML = " I like <i>Coffee</i>";工作示例：function myFunction() { var x = document.createElement("LI"); x.innerHTML = " I like <i>Coffee</i>"; document.getElementById("myList").appendChild(x);}<ul id="myList"> <li>Tea</li> <li>Milk</li> <li>Water</li></ul><p>Click the button to create a LI element.</p><button onclick="myFunction()">Try it</button>参考：Element.innerHTML 的 Mozilla 文档
随时随地看视频慕课网APP
相关分类
JavaScript