如何在不使用 jQuery 的情况下设置 html 节点的 innerText 和 innerHtml？ [复制]

【问题标题】：How can I set an html node's innerText and innerHtml without using jQuery? [duplicate]如何在不使用 jQuery 的情况下设置 html 节点的 innerText 和 innerHtml？ [复制]
【发布时间】：2016-01-19 22:10:27
【问题描述】：

在 javaScript 中，如何在不使用 jQuery 的情况下设置 html 节点内部文本和内部 html？

这是我尝试过的：

function setInnerText(className, data) {
    document.getElementsByClassName(className).innerText(data);
}

function setInnerHTML(className, data) {
    document.getElementsByClassName(className).innerHTML(data);
}

我可以帮忙吗？

谢谢。

【问题讨论】：

请注意，innerText 不是 W3C 标准，（符合标准的）等价物是 textContent。

标签： javascript innerhtml innertext

【解决方案1】：

getElementsByClassName 返回元素的集合。要设置第一个元素的innerText，请使用

document.getElementsByClassName(className)[0].innerText(data);

你也可以使用querySelector

document.querySelector('.' + className).innerText = data;

要设置所有元素的innerText，

var elements = document.getElementsByClassName(className);
// var elements = document.querySelectorAll('.' + className);

for (var i = 0, len = elements.length; i < len; i++) {
    elements[i].innerText = data;
}

【讨论】：