将类添加到 javascript 中指定元素的所有子元素(在第一级 o 层次结构中)而不使用 jquery

Question

我想把它从jquery更改为javascript： $('#id_of_element').children('div').addClass('some_class');

到目前为止，我所拥有的只是这个（不起作用）：
document.getElementById('id_of_element').getElementsByTagName('div').addClass('some_class');

我必须将所有代码从jquery更改为javascript。有没有网站在jquery旁边有javascript中的函数示例？提前感谢所有帮助:)

Answer 1

尝试

var el = document.getElementById('elem'),
    //modern browsers IE >= 10
    classList = 'classList' in el;
for (var i = 0; i < el.children.length; i++) {
    var child = el.children[i];
    if (child.tagName == 'DIV') {
        if (classList) {
            child.classList.add('test');
        } else {
            child.className += ' test'
        }
    }
}

演示：小提琴

Answer 2

如果有人想遍历所有孩子，这对我有用：

const addClassList = (element) => {
  Object.values(element.children).forEach((e) => {
    e.classList.add('myClass');
    if (e.children.length > 0) addClassList(e);
  });
};
addClassList(myElement);

注意：不适用于条件呈现

Answer 3

删除哈希（#）：在 JavaScript 中，选择 id 时不需要使用 #。

document.getElementById('id_of_element').getElementsByTagName('div').addClass('some_class');