ホームページ  >  記事  >  ウェブフロントエンド  >  DOM における Node オブジェクトと Element オブジェクトの違いの分析

DOM における Node オブジェクトと Element オブジェクトの違いの分析

不言
不言オリジナル
2018-09-01 11:39:501523ブラウズ

この記事の内容は、DOM における Node オブジェクトと Element オブジェクトの違いの分析に関するものです。必要な方は参考にしていただければ幸いです。

Nodeオブジェクト

NodeオブジェクトはDomの標準仕様で提供されており、主にDOMノードツリー構造を解析するための属性とメソッドを提供し、DOMツリー構造は主にノードに依存して解析されます。 . Node オブジェクトは、DOM ノード ツリー構造を解析するための主要な入り口です。Node オブジェクトによって提供されるプロパティとメソッドは、ノードの移動やノードの挿入などの操作を実現します

要素名.nodeName;ラベル名(大文字)

要素名.nodeType; - 要素のタイプを取得します


親ノードを取得します

ノード名.parentNode;子ノードの

Node name.parentElement; - 親要素 Node を取得します

子ノードを取得します

Node name.childNodes; - 親ノードの下にあるすべての子ノードを取得します

Node name.firstChild;親ノード

Node name.lastChild; - 親ノードの下の最後の子ノードを取得します


隣接する兄弟ノードを取得します

node name.previousSibling; - 前の兄弟要素を取得します

node name.nextSibling;次の兄弟要素

appendChild() メソッド

parent node.appendChild(child node ); - デフォルトでは、

親ノードが末尾から追加されます。ページ内); -

delete ノードをその前の親要素の指定した子ノードに追加します。 - 指定した子ノードを削除します。

Replace ノード

Parent ノード.replaceChild(新しい子ノード, ターゲット ノード); - 親ノード内の選択したターゲット子ノードを置き換えることができます

ノードをコピーします

コピーされたターゲット ノード.cloneNode(true) - true はディープ クローン作成を意味し、すべてを複製します。 false は非ディープクローンを意味し、テキストをクローンしません。デフォルトは false です。

textContent 属性

Node.textContent; - ノード内のテキストコンテンツを出力します。 DOM 標準仕様。このオブジェクトは、HTML ページのすべての要素のプロパティとメソッドを提供します。これは、主に DOM ノード ツリー構造に依存して、HTML ページのコンテンツにアクセスします。 。 Element オブジェクトは DOM 標準仕様で提供されており、主に DOM 要素のツリー構造に依存して HTML ページのコンテンツにアクセスし、更新します。このオブジェクトは Element オブジェクトの取得

から継承されます。

Parent element.firstElementChild; - 親要素の最初の子要素を取得します

隣接する兄弟要素を取得します

Element.previousElementSibling;要素の兄弟要素

element.nextElementSibling; - 要素の次の兄弟要素を取得します

Attribute 操作

element.getAttribute('属性名') - 指定された要素の指定された属性を取得します

Element.setAttribute( '属性名',' 属性値') - 指定した要素の属性名と属性値を設定します

element.removeAttribute('属性名'); - 指定した要素の属性を削除します
Element.hasAttribute('属性名' ); - 指定された要素の指定された属性が存在するかどうかを判断し、結果はブール値を返します

innerHTML 属性

element.innerHTML; - 指定された要素の HTML コードを取得します
Parent element.innerHTML=HTML code; HTML コードを親要素に追加し、文字列に直接 HTML コードを記述しますが、この方法にはセキュリティの問題があります

関連する推奨事項:


jquery オブジェクトと JavaScript オブジェクト、つまり _jquery

DOM 間の DOM オブジェクト変換XMLHttpRequest オブジェクトの属性とメソッド、domxmlhttprequest


以上がDOM における Node オブジェクトと Element オブジェクトの違いの分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。