JavaScript にはどのようなセレクターがありますか?

JavaScript セレクターには、getElementById()、getElementsByName()、getElementsByTagName()、getElementsByClassName()、querySelector() などが含まれます。

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

JavaScript にはどのようなセレクターがあるのか​​

一般的に使用される JavaScript セレクターには、getElementById()、getElementsByName()、getElementsByTagName()、getElementsByClassName() などがあります。 、querySelector()、querySelectorAll()。

1. document.querySelector()

querySelector() メソッドは、指定されたセレクターに一致する最初の要素のみを返します。すべての要素を返す必要がある場合は、

(1) ドキュメント内の id="demo" を持つ要素を取得します:

document.querySelector("#demo");

(2) Getドキュメント内の最初の要素 p の要素

document.querySelector(“p”);

(3) ドキュメント内の class="example" で最初の要素を取得

document.querySelector(".example");

(4) class=" で最初の p を取得ドキュメント内の「example」 要素：

document.querySelector(“p.example”);

(5) ドキュメント内の最初の「target」属性を持つ要素を取得：

document.querySelector(“a[target]”);

(6) 複数のセレクタを使用する場合

document.querySelectorAll(’.ynqc’)

2. document.getElementById()

このメソッドは、id 属性に対応するノード オブジェクトを返します。これは、ドキュメント オブジェクトに固有の関数です。このメソッドは、次のメソッドを使用します: document.getElementById('idName');

3. getElementsByTagName()

このメソッドは、オブジェクト配列 (正確な、htmlCollection コレクション) は、要素の順序がドキュメント内での順序を返します。getElementsByTagName() メソッドに渡される文字列では、大文字と小文字が区別されません。使用方法は次のとおりです: document.getElementsByTagName(tagName);

4. getElementsByClassName( )

このメソッドは、指定されたクラス名を持つ要素を取得するために使用されます。このメソッドは、指定されたクラス名を持つすべての要素のコレクションを返します。ドキュメントを NodeList オブジェクトとして扱います。 NodeList オブジェクトは、ノードの順序付きリストを表します。 NodeListオブジェクトは、ノードリスト内のノードインデックス番号(インデックス番号は0から始まります)を通じてリスト内のノードにアクセスできるため、使用する際に添字の指定が必要になる場合があります。 document.getElementsByClassName('className');

5. document.getElementsByName()

getElementsByName() メソッドは、指定された名前を持つオブジェクトのコレクションを返します。

このメソッドは getElementById() メソッドに似ていますが、id 属性ではなく要素の name 属性を照会します。

さらに、ドキュメント内の name 属性は一意ではない可能性があるため (たとえば、HTML フォームのラジオ ボタンは通常同じ name 属性を持ちます)、すべての getElementsByName() メソッドは、要素ではなく要素の配列を返します。要素。

6. document.querySelectorAll()

querySelectorAll() メソッドは、指定された CSS セレクターに一致するドキュメント内のすべての要素を返し、NodeList オブジェクトを返します。

NodeList オブジェクトはノードのコレクションを表します。 0 から始まるインデックスでアクセスできます。

ヒント: NodeList オブジェクトの length プロパティを使用してセレクターに一致する要素プロパティを取得し、すべての要素を反復処理して必要な情報を取得できます。

[推奨学習: JavaScript 上級チュートリアル]

以上がJavaScript にはどのようなセレクターがありますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。