JavaScript中如何将文本插入 div？

在JavaScript中，我们可以通过以下几种方式将文本插入到一个 div 元素中。

使用innerHTML属性

可以使用 innerHTML 属性来设置一个 div 元素的内容。这个属性返回或设置HTML元素的内容。下面是一个示例代码：

const myDiv = document.getElementById('myDiv');
myDiv.innerHTML = '要插入的文本';

这将在 id 为 myDiv 的元素中插入文本。

使用textContent属性

textContent 属性可以设置或返回指定元素及其后代的文本内容。下面是一个示例代码：

const myDiv = document.getElementById('myDiv');
myDiv.textContent = '要插入的文本';

这将在 id 为 myDiv 的元素中插入文本。

创建文本节点并附加到元素

另一种方式是创建一个文本节点，然后将其附加到 div 元素中。下面是一个示例代码：

const myDiv = document.getElementById('myDiv');
const textNode = document.createTextNode('要插入的文本');
myDiv.appendChild(textNode);

这将在 id 为 myDiv 的元素中插入文本。

总结：

• innerHTML 属性可以设置元素的内容，但需要注意可能出现的安全性问题。
• textContent 属性可以设置元素的文本内容，不会解析其中的HTML标签。
• 使用文本节点附加到元素的方式是一种更安全和可靠的方式。

希望这些代码片段对你有帮助！