JavaScript の概要: Dom がコレクション要素オブジェクトを取得する-jsチュートリアル-php.cn

この記事では、javascriptに関する関連知識を提供します。主に、DOM によるコレクション要素オブジェクトの取得に関連する問題について説明します。for または for...of ループを使用して、コレクション内の要素を反復できます。 Element オブジェクトのプロパティとメソッドを制御します。見てみましょう。皆さんのお役に立てれば幸いです。

JavaScript の概要: Dom がコレクション要素オブジェクトを取得する

[関連する推奨事項:JavaScript ビデオチュートリアル、Web フロントエンド]

要素オブジェクトを取得するコレクション内

Node コレクションはノードのコレクションです (インデックスは 0 から始まります)

for または for...of ループを使用しますプロパティとメソッドを操作するためのコレクション。

//在if条件表达式中写出：orderCheckbox元素对象集合中的元素节点的个数大于0 if(orderCheckboxs.length>0) { // 使用普通的for循环迭代orderCheckboxs元素对象集合中的每个元素对象 for(let i=0;i
        
         ログイン後にコピー

//用一下箭头函数哈 selectAll.onchange= (e) => { // 下面的语句是循环体，使用for…of循环迭代orderCheckboxs元素对象集合，循环变量是ele for(let ele of orderCheckboxs){ ele.checked= e.target.checked; if(e.target.checked) { ele.parentElement.classList.add('item-selected'); } else { ele.parentElement.classList.remove('item-selected'); } } };

ログイン後にコピー

#プロパティとメソッド length [n] または item(n) に対応する単一要素オブジェクトを返します。

簡単な説明
ノード内の要素オブジェクトコレクション番号
インデックス n

通常、for..of ループを使用することをお勧めします。

#***** 要素オブジェクトのコレクションを取得する次の 2 つの方法を理解します。。document(または element).getElementsByClassName('class value')

次の子孫のクラスを返します。ドキュメント fire 要素プロパティがパラメータであるすべての要素オブジェクトのコレクション。パラメーターには、HTML 要素の class 属性の値 (つまり、クラス名) のみを指定できます。

document(または要素).getElementsByTagName('タグ名')

Returnドキュメント内のすべての要素オブジェクトのコレクション、またはパラメータという名前のタグを持つ要素の子孫。パラメータには HTML 要素のタグ名のみを指定できます。

const orders= document.getElementsByClassName('order'); const input= document.getElementsByTagName('input');

ログイン後にコピー

トラバースノード

は、parentNode を除く空白テキストノードを子ノードとして扱います。見つからない場合は、null

を返します。

Attribute parentNode firstChild lastChild nextSibling previousSibling コード例:

Description
現在のノードの親ノードを返します
現在のノードの最初の子ノードを返します
現在のノードの最後の子ノードを返します現在のノード
現在のノードの次の兄弟ノードを返します
現在のノードの前の兄弟ノードを返します。兄弟ノード

 123
 快捷支付
   开通
 下单

ログイン後にコピー

要素ノードのトラバース

読み取り専用の性質要素オブジェクトの、

要素ノードのみをトラバースします (テキストと他のノードを無視します)

、見つからない場合は null

 123
 快捷支付
   开通
 下单

ログイン後にコピー

#読み取り専用属性 Description parentElement 要素の親要素ノードを返します firstElementChild 要素の最初の子要素ノード lastElementChild 要素の最後の子要素ノードを返します要素の次の兄弟要素ノードを返します要素の前の兄弟要素ノードを返します ## JavaScript ビデオチュートリアル、 webfrontend