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

Question

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

这是我尝试过的方法：

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

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

我可以帮忙吗？

谢谢。

Answer 1

getElementsByClassNamereturns元素集合。要设置第一个元素的 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;
}

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

How can I set an html node's innerText and innerHtml without using jQuery?

javascript

innerhtml

innertext