innerText と textContent: それぞれをいつ使用する必要がありますか?

textContent と innerText: どちらを使用しますか?

innerText と textContent は、要素のテキスト コンテンツにアクセスするために JavaScript でよく使用される 2 つのプロパティです。 。どちらのプロパティも同様の機能を共有しますが、それぞれの適切な使用例を決定する重要な違いがあります。

innerText

innerText は、HTML 要素内に含まれる表示テキストを返します。非表示の要素や表示スタイルが「none」に設定されている要素は除外されます。

例:

<p>Hello <span>

innerText はこれに対して 'Hello' を返します。一方、 element.

textContent

textContent は、可視性や表示スタイルに関係なく、フルテキスト コンテンツを返します。上の例では、textContent は「Hello World」を返します。

主な違い:

• 標準準拠: innerText は非対応でした。 -standard プロパティ。一方、textContent は標準化されたプロパティです。 property.
• パフォーマンス: innerText は表示テキストを決定するためにレイアウト情報を必要とするため、textContent よりもパフォーマンスが集中します。
• Scope: innerText はtextContent はすべての Node で使用できますが、HTMLElement オブジェクトでのみ使用できます。

使用上の考慮事項:

表示されているテキストのみにアクセスしたい場合は、innerText の方が効率的な選択肢になる可能性があります。ただし、テキスト コンテンツ全体を取得する必要がある場合は、textContent が優先プロパティです。

提供された例では、

var logo$ = document.getElementsByClassName('logo')[0];
logo$.textContent = "Example";

textContent を使用してテキストを更新できます。ロゴ要素の内容。既存のテキストを「例」に置き換えます。

以上がinnerText と textContent: それぞれをいつ使用する必要がありますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。