DOMの基本メソッド_基礎知識

ノードへの直接参照
1.document.getElementById(id);
-- ドキュメント内の ID でノードを検索
2.document.getElementByTagName(tagName);これらのノード
への参照を含む -- document.getElementByTagName("span"); は、スパン タイプ

のすべてのノードを返します。 2. ノード
3 への間接参照。
--要素のすべての子ノードを返します。element.childNodes[i] を使用して
--element.firstChild=element.childNodes[0]; を呼び出すことができます。 childNodes[element.childNonts.length-1];
4.element.parentNode
--親ノードを参照します
5.element.nextSibling //次の兄弟ノードを参照します
element.previousSibling; ; //前の兄弟ノードを参照します

3. ノード情報を取得します
6. ノード名属性は、要素ノードの場合、次のような返されるタグ名を取得します。 🎜>
は "a"
を返します -- 属性ノードの場合は、次のような属性名を返します。 class="test" はテスト
を返します -- テキストの場合 ノードはテキスト 7.nodeType はノードのタイプを返します --要素ノードは 1 を返します --属性ノードは 2 を返します
--テキスト ノードは 3 を返します
8.nodeValue はノードの値を返します
--要素ノードはnullを返します
--属性ノードは未定義を返します
--テキストノードはテキストコンテンツを返します
9.hasChildNodes()判定 子ノードがあるかどうか
10. tagName属性は戻ります要素
のタグ名 - この属性は要素ノードでのみ使用可能であり、要素ノード

の nodeName 属性と同等です。 4. 属性構造の処理 ポイント
11.は要素ノードの属性であり、(要素ノード.属性名)
12 を介してアクセスできます。 setAttribute() メソッドを使用して要素ノード
--elementNode.setAttribute(attributeName,attributeValue) に属性を追加します。 ;
--attributeName は属性の名前、attributeValue は属性の値です
13。getAttribute() メソッドを使用して属性値を取得します
--elementNode.getAttribute(attributeName ; Spaces,改行、タブなどはテキスト ノードとして扱われます。通常、element.childNodes[i] を通じて参照されるすべてのテキスト ノードを処理する必要があります。



6. ドキュメントの階層を変更します
15.document.createElement()メソッド 要素ノード
の作成 -- 例: document.createElement("Span");
16.document.createTextNode() メソッド テキスト ノード
の作成 -- 例: document.createTextNode(" ") ; //注: これは HTML を通じてエンコードされません。つまり、ここで作成されるのはスペースではなく文字列
17。appendChild() メソッドを使用してノード
--parentElement.appendChild を追加します。 (childElement);
18. insertBefore() メソッドを使用して子ノードを挿入します
--parentNode.insertBefore(newNode,referenceNode);
--newNode はこの前に挿入されたノードです
19. replaceChild メソッドを使用して子ノードを置き換えます
--parentNode.replaceChild(newNode,oldNode);
--注: oldNode はparentNode、
20 の子ノードである必要があります。ノードをコピーする cloneNode メソッド
--node.cloneNode(includeChildren);
--includeChildren はブール値で、その子ノードをコピーするかどうかを示します
21. 子ノードを削除するには、removeChild メソッドを使用します
--parentNode.removeChild(childNode ; =document.createElement("table"); // テーブルを作成
table.insertRow(i); // テーブルの i 行に行を挿入
row.insertCell(i) ); //行 i に行を挿入
23. セル オブジェクトを参照
24. 行とセルを削除>--table.deleteRow (index);
--row.deleteCell(index);
25. 2 つのセルの位置を取得します
node1.swapNode(node2); --このメソッドは Firefox で使用できます。
一般メソッドではエラーが発生します:
function swapNode(node1,node2)
{
var _parent=node1.parentNode;
var _t1=node1; .nextSubling;
var _t2=node2 .nextSubling;
if(_t1)parent.insertBefore(node2,_t1);
if(_t2)parent.insertBefore (node1,_t2);
else _parent.appendChild(node1);


すべての空のノードを削除します:


nodetype=3 ノード タイプはtext s はすべての空白と一致します
指定されたインデックス位置にノードを挿入します
function insertAt(parentNode,newNode,index)
{
if(!parentNode.hasChildNodes())
{
parentNode.appendChild(newNode);
return newNode;
}
//インデックスが存在しない場合は try を使用して例外をキャッチします
try{
parentNode.insertBefore(newNode,parentNode. childNodes[インデックス]);
}
catch(e){
return null;
return newNode;