ホームページ >ウェブフロントエンド >htmlチュートリアル >NodeList、HTMLCollection、NamedNodeMap の使用法を理解する (コード)

NodeList、HTMLCollection、NamedNodeMap の使用法を理解する (コード)

云罗郡主
云罗郡主転載
2018-10-17 14:53:042086ブラウズ

この記事の内容は、NodeList、HTMLCollection、NamedNodeMap の使用法 (コード) を理解することに関するものです。必要な方は参考にしていただければ幸いです。

#これら 3 つは配列のようなオブジェクトです。

  1. HTMLCollection には要素ノードのみが含まれますが、NodeList には任意のノード タイプが含まれます。

  2. HTMLCollection オブジェクトは item() メソッドとnamedItem() メソッドを呼び出すことができますが、NodeList オブジェクトは item() メソッドのみを呼び出すことができます。要素を取得するときは、どちらも角かっこ構文または item() メソッドを通じて実行できます。 HTMLCollection オブジェクトを使用すると、namedItem() メソッドを通じて名前または ID を渡すことによって要素を取得できます。

  3. 一部の古いブラウザのメソッド (getElementsByClassName() など) は、HTMLCollection オブジェクトの代わりに NodeList オブジェクトを返します。すべてのブラウザの childNodes プロパティは NodeList オブジェクトを返します。ほとんどのブラウザの querySelectorAll() は NodeList オブジェクトを返します。 getElementsByTagName() は HTMLCollection オブジェクトを返します。

  4. NamedNodeMap オブジェクトは、node.attributes 属性を通じて取得され、要素のすべての属性で構成される疑似配列オブジェクトが取得されます。

例:

<body>
<p>
  <a href="#" id="a1">1</a>
  <a href="a.html" name="a2">2</a>
</p>
</body>
<script>
	// 获取一个HTMLCollection对象
	var res = document.getElementsByTagName("a");
	console.log(res);
	console.log(res.item(0))
	console.log(res[0])
	console.log(res.namedItem(&#39;a1&#39;))
	console.log(res.namedItem(&#39;a2&#39;))
	// 结果如下图所示:
</script>

NodeList、HTMLCollection、NamedNodeMap の使用法を理解する (コード)

上記は、NodeList、HTMLCollection、および NamedNodeMap If の使用 (コード) の完全な紹介です。

HTML ビデオ チュートリアル について詳しく知りたい場合は、PHP 中国語 Web サイトに注目してください。

以上がNodeList、HTMLCollection、NamedNodeMap の使用法を理解する (コード)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はcsdn.netで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。