Heim >Web-Frontend >js-Tutorial >Warum werden mit innerHTML eingefügte Skripte nicht immer ausgeführt, und wie kann ich das beheben?

Warum werden mit innerHTML eingefügte Skripte nicht immer ausgeführt, und wie kann ich das beheben?

Susan Sarandon
Susan SarandonOriginal
2024-12-18 21:28:17176Durchsuche

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

Mit innerHTML eingefügte Skripte ausführen

Das Einfügen von Skripten in eine Webseite mithilfe von innerHTML kann eine Herausforderung sein, da die Skripte möglicherweise im DOM angezeigt werden scheitern an der Ausführung. Dies liegt an der unterschiedlichen Art und Weise, wie Browser die Skriptausführung handhaben, wenn sie einer Seite dynamisch hinzugefügt werden.

Um dies zu umgehen, besteht eine Methode darin, das DOM rekursiv nach Skriptelementen zu durchsuchen und diese durch ausführbare Klone zu ersetzen. Hier ist eine Schritt-für-Schritt-Erklärung der rekursiven Skript-Ersetzungsfunktion:

function nodeScriptReplace(node) {
  • Diese Funktion nimmt einen Knoten als Argument und prüft, ob es sich um ein Skriptelement handelt (d. h. sein tagName ist „ SCRIPT').
  • Wenn es sich um ein Skriptelement handelt, wird es durch einen Klon ersetzt, der denselben Code enthält (erreicht über nodeScriptClone()).
  • Wenn es sich nicht um ein Skriptelement handelt, durchsucht es die untergeordneten Knoten des Knotens rekursiv nach Skriptelementen.
function nodeScriptClone(node) {
  • Diese Funktion erstellt ein neues Skriptelement, dessen Text (Code) mit dem Code des ursprünglichen Skriptknotens übereinstimmt.
  • Es kopiert außerdem alle Attribute vom ursprünglichen Knoten in den Klon, um sie beizubehalten alle Einstellungen wie das Attribut „src“.
function nodeScriptIs(node) {
  • Diese Funktion fungiert als Hilfsmittel, um festzustellen, ob ein Knoten ein Skriptelement ist, indem es seinen tagName überprüft.

Beispielverwendung:

Um mit innerHTML eingefügte Skripte auszuführen, rufen Sie nodeScriptReplace() auf. Funktion im Textkörper des Dokuments (oder eines anderen gewünschten Containers).

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

Durch die Verwendung dieses rekursiven Ansatzes werden alle während des Suchvorgangs angetroffenen Skriptelemente durch ausführbare Klone ersetzt, wodurch eine ordnungsgemäße Skriptausführung sichergestellt wird eingefügt mit innerHTML.

Das obige ist der detaillierte Inhalt vonWarum werden mit innerHTML eingefügte Skripte nicht immer ausgeführt, und wie kann ich das beheben?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn