JQueryを使用せずにDOMから選択した要素を非表示にする

Question

次のコードはどのようにネイティブJSのように見えますか？

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

Answer 1

この質問は幅広いです。 jQueryの内部でそれをしない方法がありますが、その後、あなたはjQueryのそれを行うことがどのように独立したばかりのネイティブのJavaScript、でそれを行うことができる方法があります：

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

document.querySelectorAllを一緒に使用することはできませんnodelistを返すのでforEachの場合はnodelistのsliceを呼び出して実際の配列に変換できます。その後、見つかったものすべてをループし、styleプロパティを更新します。

---

これは、私は上記のアプローチを好むものの、forEachを使用していません代替です）

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