javascript - 不使用 JQuery 隐藏 DOM 中选定的元素

Question

下面的代码在原生 JS 中是什么样子的？

$(".custom-popover").hide();

Answer 1

这个问题有点宽泛。有一种 jQuery 内部执行此操作的方法，还有一种仅使用 native JavaScript 即可执行此操作的方法，与 jQuery 的执行方式无关:

[].slice.call(
    document.querySelectorAll('.custom-popover')).forEach(function (el) {
        el.style.display = 'none';
    }
);

由于 document.querySelectorAll 返回一个无法与 forEach 一起使用的 nodelist，因此您可以通过调用 将其转换为实际数组节点列表上的>切片。之后，循环遍历找到的所有内容并更新 style 属性。

<小时/>

这是一个不使用 forEach 的替代方案，尽管我更喜欢上述方法:

var els = document.querySelectorAll('.custom-popover');
for (var i = 0; i < els.length; i++) {
    els[i].style.display = 'none';
}