☰

クラス名で要素を取得するにはどうすればいいですか? [重複] 質問する

tag-icon • tag-icon javascript dom
クラス名で要素を取得するにはどうすればいいですか? [重複] 質問する

JavaScript を使用すると、次の構文を使用して ID で要素を取得できます。

var x=document.getElementById("by_id");

クラス別に要素を取得するために、次の操作を試しました:

var y=document.getElementByClass("by_class");

しかし、それはエラーになりました:

getElementByClass is not function

クラス別に要素を取得するにはどうすればよいですか?

ベストアンサー1

DOM 関数の名前は実際には でありgetElementsByClassName、 ではありませんgetElementByClassName。これは、ページ上の複数の要素が同じクラスを持つことができるため、 ですElements。

この戻り値は NodeList インスタンス、またはNodeList(FF、たとえば は のインスタンスを返しますHTMLCollection) のスーパーセットになります。いずれにせよ、戻り値は配列のようなオブジェクトです。

var y = document.getElementsByClassName('foo');
var aNode = y[0];

もし何らかの理由であなたが必要戻りオブジェクトを配列として返す場合は、魔法の length プロパティのおかげで簡単に実行できます。

var arrFromList = Array.prototype.slice.call(y);
//or as per AntonB's comment:
var arrFromList = [].slice.call(y);

としてイッカートcaniuse.com によると、これらの方法の方が確かに支持率が高い (93.99% 対 87.24%) ため、推奨されており、好ましい方法であるquerySelector('.foo')と思われます。querySelectorAll('.foo')

おすすめ記事