JavaScript における innerHTML、innerText、outerHTML の違い

最近、JavaScript の知識をまとめてみんなと共有しました。この記事は主に JavaScript における innerHTML、innerText、outerHTML の使用法の違いについて説明しています。必要な方は参考にしていただければ幸いです。

使用法:

<div id="test">
   <span style="color:red">test1</span> test2
</div>

は JS で使用できます:

test.innerHTML:

つまり、最初からオブジェクト HTML タグを含む、位置から終了位置までのすべてのコンテンツ。

上記の例の test.innerHTML の値は、「0bbd5cc33b622ada7b9ba1b438e60276test154bdf357c58b8a65c66d7c19c8e4d114 test2」です。

test.innerText:

開始位置から終了位置までのコンテンツですが、上記の Html タグ

text.innerTest が削除されます。例 値は、span タグが削除された「test1 test2」です。

test.outerHTML:

innerHTML のコンテンツ全体に加えて、object タグ自体も含まれます。

上記の例の text.outerHTML の値は 024ec8e648c1f06980a2d32e6dcf0f0b0bbd5cc33b622ada7b9ba1b438e60276test154bdf357c58b8a65c66d7c19c8e4d114 test216b28748ea4df4d9c2150843fecfba68

完全な例:

<div id="test">
   <span style="color:red">test1</span> test2
</div>
innerHTML内容
inerHTML内容
outerHTML内容

特記事項:

innerHTML は W3C 標準に準拠する属性であり、innerText は IE ブラウザにのみ適用できるため、可能な限り innerHTML を使用し、innerText を使用しないようにします。HTML タグを含まないコンテンツを出力する場合は、innerHTML を使用して HTML タグを含むコンテンツを取得し、正規表現を使用して HTML タグを削除します。 W3C 標準準拠 例:

33c223e7f941562df66a891e54a2406a/gim,''))" >HTML なし、W3C 標準に準拠5db79b134e9f6b82c0b36e0489ee08ed。

以上がJavaScript における innerHTML、innerText、outerHTML の違いの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。