私は1</p> <p>に、ダイアログクラスのいくつかの要素のzインデックスを設定するクラス

Question

内のすべてのオブジェクトののZIndexの定義現在、私は以下のコード使用しています：

document.getElementsByClassName("dialog")[0].style.zIndex = "1"; 

をしかし、確かに最初の要素のためにのみ動作します。私はクラス内に固定数のオブジェクトを持っていないので、配列を定義することもできません。この問題を解決する別の方法はありますか？

Answer 1

は、ループを使用します。

var els = document.getElementsByClassName("dialog"); 

for (var i = 0, l = els.length; i < l; i++) { 
    els[i].style.zIndex = 1; 
} 

そして、ここでループ選択肢に楽しい作品です：http://htmlcssjavascript.com/javascript/another-front-end-engineer-interviewing-question-loop-alternatives/

更新：コメントで指摘したように、書かれたとして、あなたのコードは、最初の要素（インデックス[影響します0]）。メソッドgetElementsByClassNameは、選択されたすべての要素を含むNodeListを返します。個々の要素を個別に更新するためには、リストを反復処理する必要があります。

Answer 2

おそらく、そうのような）のgetElementsByClassName（によって返された配列の要素を反復処理したい：

var a = document.getElementsByClassName("dialog"); 
for (var x = 0; x < a.length; x++) { 
    a[x].style.zIndex = 1; 
} 

Answer 3

[0]を使用することで、あなただけの最初の要素を選択しています。

これらの要素をループする別の方法をお見せしたいと思います。

var a = document.getElementsByClassName('dialog'), 
    forEach = Array.prototype.forEach.call.bind(Array.prototype.forEach) 

forEach(a, function(el) { 
    el.style.zIndex = 1 
})