javascript - ネイティブJavaScriptでクラスまたはタグ要素を取得できません

Question

ドキュメントを読み込んだ後、いくつかの要素を非表示にしようとしています。私はこれをなんとかすることができますが、またはgetElementByIdを使用している間はこれを行うことができません。getElementsByClassNamegetElementsByTagName

私はたくさんの質問と回答を読みましたが、解決策が見つかりません。これがサンプルのフィドルです。

javascript：

function myFunction() {
  document.getElementById("b").style.display="none";
  document.getElementsByTagName('p').style.display="none";
  document.getElementsByClassName("a").style.display="none";
}
onload = myFunction;

html：

<p>Tag Ele Test</p>
<p class="a">Class Test</p>
<p id="b">ID Test</p>

Answer 1

getElementsByTagName()との問題getElementsByClassName()は、どちらも反復する必要のある要素のセットをgetElementById()返すのに対し、単一の要素を返すことです。

var elements = document.getElementsByTagName("p");
for (var i = 0; i < elements.length; i++) {
    elements[i].style.display = "none";
}

参照：

1. https://developer.mozilla.org/en-US/docs/DOM/document.getElementsByTagName
2. https://developer.mozilla.org/en-US/docs/DOM/document.getElementsByClassName

Answer 2

getElement s （byTagName、byClassName）は、を返しNodeListます。これを繰り返す必要があります。単一のstyle宣言プロパティはありません。

var element = document.getElementById("b");
if (element != null)
    element.style.display = "none";
var elements = document.getElementsByTagName('p');
for (var i=0; i<elements.length; i++)
    elements[i].style.display = "none";
elements = document.getElementsByClassName("a");
for (var i=0; i<elements.length; i++)
    elements[i].style.display = "none";