我想在段落上为一个单词着色,但我用 TextNode 创建了这个段落,然后像一些文本一样显示。
例子 :
<!DOCTYPE html>
<html>
<body>
<p>Click the button to create a Text Node.</p>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
var t = document.createTextNode("Hello World <span style=\"color: #BA0000\">error</span> ");
document.body.appendChild(t);
}
</script>
</body>
</html>
最佳答案
您想创建一个 元素 不是文字。 文本节点 将显示您提供的任何文本,而不是构建您传递给它的 html。因此,您需要在变量中单独创建元素,或者使用您拥有的任何内容设置父元素的 innerHTML,例如 <span>
。 .
尝试创建一个像段落标签这样的元素,然后将其设置为如下所示的 innerhtml:
var t = document.createElement('p');
t.innerHTML = "Hello World <span style=\"color:#BA0000\">error</span> ";
这将为您提供您想要的带有 html 的元素,而不仅仅是文本。请参见下面的示例。
<!DOCTYPE html>
<html>
<body>
<p>Click the button to create a Text Node.</p>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
var t = document.createElement('p');
t.innerHTML = "Hello World <span style=\"color:#BA0000\">error</span> ";
document.body.appendChild(t);
}
</script>
</body>
</html>
关于javascript - 在带有 createTextNode 的段落上使用 <span>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60116055/