[解決済み] ピュアJavascriptでクラスごとに要素を隠す [重複]。

質問

以下のコードを試しましたが、それは は動作しません。 . どこで間違ったのか、何か思い当たることはありますか？

document.getElementsByClassName('appBanner').style.visibility='hidden';

<div class="appBanner">appbanner</div>

を使っているので、jQueryを使ったり、HTMLを変更したりすることはできません。 [self->webView stringByEvaluatingJavaScriptFromString:@""]; をObjective-Cで作成しました。

どのように解決するのですか？

document.getElementsByClassName は HTMLCollection (配列のようなオブジェクト) の中に、クラス名にマッチするすべての要素が含まれています。また style プロパティは Element でなく HTMLCollection . 最初の要素には、ブラケット(添え字)記法でアクセスする必要があります。

document.getElementsByClassName('appBanner')[0].style.visibility = 'hidden';

jsFiddleを更新しました。

セレクタAPIを使用して、クラスに一致するすべての要素のスタイルルールを変更する。

[].forEach.call(document.querySelectorAll('.appBanner'), function (el) {
  el.style.visibility = 'hidden';
});

もし for...of が利用できます。

for (let el of document.querySelectorAll('.appBanner')) el.style.visibility = 'hidden';