innerHTML を使用せずに HTML を DOM に追加するにはどうすればよいですか?

InnerHTML を使用せずに HTML を DOM に追加する

HTML 文字列を DOM に追加する場合、div.innerHTML = を使用するシナリオが発生する可能性があります。 str;は受け入れられません。このような場合は、最新のすべてのブラウザでサポートされている insertAdjacentHTML メソッドを利用できます。

ID が「test」の div に HTML 文字列を追加するには、次のコードを使用できます。

var str = '<p>Just some <span>text</span> here</p>';
var div = document.getElementById('test');
div.insertAdjacentHTML('beforeend', str);

insertAdjacentHTML メソッドを使用すると、指定した要素の末尾の前に HTML 文字列を挿入し、要素内に確実に挿入できます。 「beforeend」位置パラメータは、要素の最後の子の後に HTML を追加することを指定します。

insertAdjacentHTML メソッドを利用すると、HTML を DOM に追加する多用途かつ効率的な方法が得られます。 innerHTML プロパティ。特定のコンテキストではパフォーマンスへの影響やセキュリティの脆弱性が発生する可能性があります。

以上がinnerHTML を使用せずに HTML を DOM に追加するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。