innerText および innerHTML_javascript スキルの問題分析

innerText 属性は、開始タグと終了タグの間のテキストを変更するために使用されます。たとえば、空の

要素があり、それを

div.

の新しいテキストに変換したいとします。 DOM を使用して実装する場合は、次のようにします。
oDiv.appendChild(document.createTextNode("New text for the div."));
このコードは読みにくいわけではありませんが、非常に冗長です。 innerText を使用する場合は、次のようにします。
oDiv.innerText = "div の新しいテキスト";
innerText を使用すると、コードがより簡潔になり、理解しやすくなります。さらに、innerText は、不等号、大なり号、引用符、および & 記号を自動的に HTML エンコードするため、特殊文字について注意する必要はありません。
oDiv.innerText = ".";

このコード行の実行結果は、

.

の新しいテキストです。しかし、要素に HTML タグを含めるにはどうすればよいでしょうか?これが innerHTML が解決しようとしている問題です。

innerHTML 機能を使用すると、要素の作成に DOM メソッドの使用を考慮せずに、HTML 文字列を要素に直接割り当てることができます。たとえば、空の
が

HelloWorld になるとします。 DOM を使用するには、次のコードを使用します:

var oStrong = document.createElement("strong');
oStrong.appendChild(document.createTextNode("hello"));
var oEm = document.createElement ("em");
oEm.appendChild(document.createTextNode("World"));
oDiv.appendChild(document.createTextNode("")); 🎜>oDiv.appendChild(oEm);
innerHTML を使用すると、コードは次のようになります。
oDiv.innerHTML = "
Hello

World"; 要素にテキストのみが含まれている場合、innerText と innerHTML は同じ値を返します。他の要素の場合、innerText はテキストの表現のみを返しますが、innerHTML はすべての要素とテキストの HTML コードを返します。以下の表に、innerText と innerHTML によって返されるさまざまな値を示します。特定のコード。

コード

インナーテキスト

インナーHTML

こんにちは

「ハローワールド」

「ハローワールド」

こんにちは世界

「ハローワールド」

「こんにちはワールド」

代码	innerText	innerHTML
Hello world	"Hello world"	"Hello world"
Helloworld	"Hello world"	"Helloworld"
	""	""

""

""

。innerText をそれ自体に割り当てて、すべてを削除することを示します。指定された要素の HTML タグ。
oDiv.innerText = oDiv.innerText;