386 Stimmen

Wie kann ich auf das Skript-Tag verweisen, das das aktuell ausgeführte Skript geladen hat?

Wie kann ich auf das Skript-Element verweisen, das das gerade laufende Javascript geladen hat?

Die Situation ist wie folgt. Ich habe ein "Master"-Skript, das ganz oben auf der Seite geladen wird, als Erstes unter dem HEAD-Tag.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript" src="scripts.js"></script>

Es gibt ein Skript in der Datei "scripts.js", das in der Lage sein muss, andere Skripte auf Abruf zu laden. Die normale Methode funktioniert für mich nicht ganz, weil ich neue Skripte hinzufügen muss, ohne auf das HEAD-Tag zu verweisen, weil das HEAD-Element noch nicht fertig gerendert ist:

document.getElementsByTagName('head')[0].appendChild(v);

Ich möchte auf das Skriptelement verweisen, das das aktuelle Skript geladen hat, so dass ich meine neuen, dynamisch geladenen Skript-Tags danach an das DOM anhängen kann.

<script type="text/javascript" src="scripts.js"></script>
loaded by scripts.js--><script type="text/javascript" src="new_script1.js"></script>
loaded by scripts.js --><script type="text/javascript" src="new_script2.js"></script>

8voto

David Callizaya Punkte 81

Es muss beim Laden der Seite funktionieren und wenn ein Skript-Tag mit Javascript hinzugefügt wird (z.B. mit Ajax)

<script id="currentScript">
var $this = document.getElementById("currentScript");
$this.setAttribute("id","");
//...
</script>

6voto

Um das Skript zu erhalten, das gerade geladen ist, können Sie Folgendes verwenden

var thisScript = document.currentScript;

Sie müssen einen Verweis am Anfang Ihres Skripts aufbewahren, damit Sie später

var url = thisScript.src

5voto

Pete Blois Punkte 204

Ein Ansatz für den Umgang mit asynchronen und zeitversetzten Skripten besteht darin, den Onload-Handler zu nutzen - setzen Sie einen Onload-Handler für alle Skript-Tags und der erste, der ausgeführt wird, sollte Ihrer sein.

function getCurrentScript(callback) {
  if (document.currentScript) {
    callback(document.currentScript);
    return;
  }
  var scripts = document.scripts;
  function onLoad() {
    for (var i = 0; i < scripts.length; ++i) {
      scripts[i].removeEventListener('load', onLoad, false);
    }
    callback(event.target);
  }
  for (var i = 0; i < scripts.length; ++i) {
    scripts[i].addEventListener('load', onLoad, false);
  }
}

getCurrentScript(function(currentScript) {
  window.console.log(currentScript.src);
});

4voto

Ferdinand Liu Punkte 314

Folgen Sie diesen einfachen Schritten, um einen Verweis auf den aktuell ausgeführten Skriptblock zu erhalten:

  1. Fügen Sie eine zufällige, eindeutige Zeichenfolge in den Skriptblock ein (muss in jedem Skriptblock eindeutig/anders sein)
  2. Iterieren Sie das Ergebnis von document.getElementsByTagName('script') und suchen Sie die eindeutige Zeichenfolge aus jedem ihrer Inhalte (die Sie aus der Eigenschaft innerText/textContent erhalten).

Beispiel (ABCDE345678 ist die eindeutige ID) :

<script type="text/javascript">
var A=document.getElementsByTagName('script'),i=count(A),thi$;
for(;i;thi$=A[--i])
  if((thi$.innerText||thi$.textContent).indexOf('ABCDE345678'))break;
// Now thi$ is refer to current script block
</script>

btw, in Ihrem Fall können Sie einfach die altmodische document.write()-Methode verwenden, um ein anderes Skript einzubinden. Da Sie erwähnten, dass das DOM noch nicht gerendert ist, können Sie sich die Tatsache zunutze machen, dass der Browser Skripte immer in linearer Reihenfolge ausführt (mit Ausnahme von aufgeschobenen Skripten, die später gerendert werden), so dass der Rest Ihres Dokuments noch "nicht vorhanden" ist. Alles, was Sie über document.write() schreiben, wird direkt nach dem aufrufenden Skript platziert.

Beispiel für die ursprüngliche HTML-Seite :

<!doctype html>
<html><head>
<script src="script.js"></script>
<script src="otherscript.js"></script>
<body>anything</body></html>

Inhalt von script.js :

document.write('<script src="inserted.js"></script>');

Nach dem Rendern wird die DOM-Struktur zu:

HEAD
  SCRIPT script.js
  SCRIPT inserted.js
  SCRIPT otherscript.js
BODY

3voto

LSOJ Punkte 51

Betrachten Sie diesen Algorithmus. Wenn Ihr Skript geladen wird (wenn es mehrere identische Skripte gibt), durchsuchen Sie document.scripts, suchen Sie das erste Skript mit dem richtigen "src"-Attribut, speichern Sie es und markieren Sie es als "besucht" mit einem Datenattribut oder einem eindeutigen Klassennamen.

Wenn das nächste Skript geladen wird, wird document.scripts erneut durchsucht, wobei alle bereits als besucht markierten Skripte übergangen werden. Nehmen Sie die erste nicht besuchte Instanz dieses Skripts.

Dabei wird davon ausgegangen, dass identische Skripte wahrscheinlich in der Reihenfolge ausgeführt werden, in der sie geladen werden, d. h. vom Kopf zum Körper, von oben nach unten, von synchron zu asynchron.

(function () {
  var scripts = document.scripts;

  // Scan for this data-* attribute
  var dataAttr = 'data-your-attribute-here';

  var i = 0;
  var script;
  while (i < scripts.length) {
    script = scripts[i];
    if (/your_script_here\.js/i.test(script.src)
        && !script.hasAttribute(dataAttr)) {

        // A good match will break the loop before
        // script is set to null.
        break;
    }

    // If we exit the loop through a while condition failure,
    // a check for null will reveal there are no matches.
    script = null;
    ++i;
  }

  /**
   * This specific your_script_here.js script tag.
   * @type {Element|Node}
   */
  var yourScriptVariable = null;

  // Mark the script an pass it on.
  if (script) {
    script.setAttribute(dataAttr, '');
    yourScriptVariable = script;
  }
})();

Dadurch werden alle Skripte nach dem ersten passenden Skript durchsucht, das nicht mit dem speziellen Attribut gekennzeichnet ist.

Markieren Sie dann diesen Knoten, falls er gefunden wird, mit einem Datenattribut, damit er bei nachfolgenden Suchvorgängen nicht ausgewählt wird. Dies ähnelt den Graph-Traversal-Algorithmen BFS und DFS, bei denen Knoten als "besucht" markiert werden können, um ein erneutes Aufsuchen zu verhindern.

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X