[Javascript]ノードの取得

ノードの取得
前の記事では,DOMとノードの概念について議論した.今期の記事では、ノードの最初のステップである노드 취득について説明します.노드 취득は、ノードを操作するためにドキュメントツリーで特定のノードを選択することを示す.CSSのコレクタのように、操作するノードを選択します.
では、ノードを取得する方法について説明しましょう.
id
第1の方法は、idによってノードを取得することである.idはhtml属性idを表す.ノードはidで、次の情報を取得します.

document.getElementById(id);

ラベル名
htmlタグ名のあるノードを取得する方法.以前のidがhtmlから1回しか来ないため、1つのノードのみを取得する場合、タグ名はドキュメント内のすべてのタグを取得するために使用されます.また、ドキュメントに複数のタグが存在する場合、すべてのタグが取得されるため、取得値はリスト形式である可能性があります.

document.getElementsByTagName(tagName);

先日、複数の取得値がある場合、リスト形式で返され、より正確にはHTMLCollectionというオブジェクトでした.このオブジェクトを処理する構成と方法は次のとおりです.

classclassを使用してノードを取得します.これは、JavaScriptのクラスではなくhtml属性classを意味します.
取得classノードは、以下に示すように、クラス生成キーワードclassとの混用を避けるためにClassNameを使用する.

document.getElementByClassName(class);

classはまた、1つのドキュメントに複数のオブジェクトが存在する可能性があるため、HTMLCollectionオブジェクトに戻ることもできる.
name<form>ラベルでは、フォームを区別するためにnameプロパティを追加できます.name属性でノードを取得する方法.

document.getElemntsByName(name);

nameはidと同じように唯一の名前があります.しかしながら、idは、通常、ラジオボタンやチェックボックスなどの要素からノードを取得するためのより便利な方法であり、これらの要素は、nameの下で異なる値(value)を有する.
querySelecter, querySelecterAllquerySelecterは、以前の方法とは異なり、条件を選択することによってノードを検索および取得する方法である.この方法の利点は、特定の検索によってノードを取得することができるが、処理速度が遅いため、getElementByがより多く使用されることである.querySelecterは、

document.querySelector(selector);
document.querySelectorAll(selector);

querySelecterは、コレクタ式と最も早く一致する要素のみを返します.これはツリー構造なので、ナビゲーション時に上部から検索を開始します.querySelecterAllは、一致するすべての要素を集合として返す.
ライトコレクターのようにコレクター式を書けばいいです.コレクターの内容については、次の文書を参照してください.

コレクタ

せつぞくコレクタ

アトリビュートコレクタ(Attribute Collector)

HTML CollectionとNoteListの注意事項
なお、複数のノード値を取得した場合に返されるオブジェクトHTMLCollectionおよびNodeList.これらのオブジェクトは살아있는の状態にある.살아있다は、文書が変更された場合、取得されたノードの値もリアルタイムで変更されることを示す.
したがって,ノードを処理する際には,それらが生きていることを覚え,利用しなければならない.querySelectorAllの場合、NodeListのオブジェクトが返されます.ただし、querySelectorAllはノードをコピーしてオブジェクトに変換するため、生きているわけではありません.