创建文本节点并添加CSS

Question

我正在尝试创建一个文本元素，然后添加CSS属性我尝试使用下面的代码function create(text){  var t = document.createTextNode(text);    t.style.color = "black"  t.style.backgroundColor="white"  t.style.borderRadius="20px"  t.style.border="4px solid black"  document.body.appendChild(t);}create("hello");我希望创建一个带有白色背景和20px边框半径和4px实心黑色边框的文本

Answer 1

您的方向正确。您唯一需要做的就是更改document.createTextNode(text)：

var t = document.createElement('span');

t.innerText = text;

\\...

document.body.appendChild(t);

代码不起作用的原因是，您只能设置HTML标记的样式，并且创建的文本节点仅包含添加的字符串，而没有周围的标记。

例如：

<span>

  hello

</span>

是带有一些文本的标签，而hello中间的文本是TextNode。

希望这是有道理的。