ホームページ >ウェブフロントエンド >jsチュートリアル >innerHTML 経由で追加されたスクリプトが常に実行されないのはなぜですか?それを修正するにはどうすればよいですか?

innerHTML 経由で追加されたスクリプトが常に実行されないのはなぜですか?それを修正するにはどうすればよいですか?

Patricia Arquetteオリジナル: 2024-12-23 00:22:10686ブラウズ

Why Don't Scripts Added via innerHTML Always Execute, and How Can I Fix It?

innerHTML にスクリプトを組み込むことはできますか?

innerHTML を使用して

にスクリプトをページに挿入します。 Firefox や Chrome などのブラウザでは実行されずに、スクリプトが DOM に表示される可能性があります。この記事では、この動作の背後にある理由を調査し、そのようなスクリプトを実行可能にする解決策を提供します。

サンプルコードで提供されている HTML は、

内でスクリプトを実行しようとしている様子を示しています。 innerHTML を使用します。ただし、スクリプトの実行に失敗したことを示す、目的の警告メッセージ「hi」は表示されません。

この問題に対処するために、すべての実行不可能なスクリプトを実行可能なスクリプトに再帰的に置き換える方法を紹介します。このメソッドは、nodeScriptReplace として知られ、DOM ツリーを横断してスクリプト要素を識別します。実行不可能なスクリプトが見つかった場合、スクリプトのクローンが作成され、実行可能なコンテンツが割り当てられ、元のスクリプト要素が置き換えられて、実行可能になります。

さらに、nodeScriptClone 関数は、スクリプト要素を抽出して実行可能なスクリプト要素を作成します。実行不可能なスクリプトの innerHTML とその属性の設定。これらの属性は新しい実行可能スクリプトに転送され、適切な動作が保証されます。

nodeScriptIs 関数は、タグ名を調べることによって、指定されたノードがスクリプト要素であるかどうかを確認します。

スクリプトを実行して表示するには「hi」アラートの場合は、ページのルート要素でnodeScriptReplaceを呼び出すだけです。以下のコードスニペットは、これを示しています。

nodeScriptReplace(document.getElementsByTagName("body")[0]);

このメソッドは、innerHTML を使用してページに追加されたスクリプトを実行するための堅牢なメカニズムを提供し、意図した機能を保証します。

以上がinnerHTML 経由で追加されたスクリプトが常に実行されないのはなぜですか?それを修正するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

firefox chrome html if for using function dom this innerHTML alert display issue

声明：

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

前の記事：統合テスト: シームレスなソフトウェア相互作用の確保次の記事：統合テスト: シームレスなソフトウェア相互作用の確保

続きを見る