在createTextNode()之后更改字体

Question

我需要更改createTextNode()函数创建的元素的字体：

var s = document.createTextNode(item.text);
s.setAttribute("font size") = -1;
elem.appendChild(s);

在我的代码中，我得到了Firebug上的错误：

s.setAttribute不是一个函数

如何更改已创建元素的字体？

Answer 1

您没有在文本节点上指定字体，而是在父元素上指定字体--在您的示例中：

elem.style.fontSize = "20px";

如果不希望更改整个父元素的字体大小，则可以创建一个<span>元素来环绕文本节点：

var span = document.createElement('span');
span.style.fontSize = "20px";
span.appendChild(s);
elem.appendChild(span);

Answer 2

createTextNode创建一个只有一个方法的文本节点: splitText。setAttribute是DOM的一种方法，它由元素接口(即不是文本节点)实现。

通常，您应该避免使用setAttribute，因为它有许多奇怪之处，并且设置相关的DOM属性更快、更可靠。

无论如何，HTML4.01中没有为文本节点指定"fontSize“属性，所以您不能期望浏览器实现它。文本节点从其父元素继承其样式，因此，如果要设置某些文本的字体大小，请将其包装在元素中：

window.onload = function() {
  var span = document.createElement('span');

  // Set DOM property
  span.style.fontSize = '200%';
  span.appendChild(document.createTextNode('hey'));

  // Add to document
  document.body.appendChild(span);
};

但是通常情况下，最好在类中定义样式并将其附加到span中。

Answer 3

也许你可以使用内联css。但是，从没有尝试过使用文本节点。

setAttribute('style', 'font-size:-1;');