Question

我想在我的段落中加粗文字，但我不确定要准确追加什么。这是我的代码。

<p id="para">
  Hello World
</p>

var para = document.getElementById('para');
var bold = document.createElement('STRONG');

para.appendChild(bold);

有什么想法吗？

谢谢！

Answer 1

strong元素必须包含 textnode 。

＆＃13;

var para = document.getElementById('para'),
    bold = document.createElement('strong'),
    textnode = document.createTextNode("I'm bold!"); 
    bold.appendChild(textnode); 
    
    para.appendChild(bold);

＆＃13;

<p id="para">
  Hello World
</p>

＆＃13;

Answer 2

使用strong元素替换文本内容：

// Get paragraph element
var para = document.getElementById('para');

// Create a strong node
var bold = document.createElement('strong');

// Get first child element of paragraph which is a text node
var textNode = para.firstChild;

// Append text to new strong node
bold.appendChild(document.createTextNode(textNode.nodeValue));

// Replace old text node with new strong node
para.replaceChild(bold, textNode);

JS小提琴演示：https://jsfiddle.net/q9mpa7ws/3/

仅CSS方法：https://jsfiddle.net/hrecvvbj/1/

使用JavaScript方式设计样式：https://jsfiddle.net/qynek529/2/

Answer 3

您根本不需要担心添加新节点;只需通过JavaScript fontWeight DOM Style Object：

更改字体权重

＆＃13;

document.getElementById("para").style.fontWeight = "bold";

＆＃13;

<p id="para">
  Hello World
</p>

＆＃13;

希望这有帮助！：）

Answer 4

尽量让您的疑虑分开。创建一个css类并应用它。

// in your css
.bold {
    font-weight: bold;
}

// in your javascript
para.className = 'bold';

在DOM中粗体化文本节点

4 个答案: