Was bedeutet ein Script-Tag mit src UND Inhalt?


122

Beispiel von Googles +1 Button:

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
      {"parsetags": "explicit"}
</script>

Das Skript-Tag hat ein src-Attribut und Inhalt. Was bedeutet das und wie funktioniert es?


Firebug Lite verwendet diese Methode: getfirebug.com/firebuglite
Brad

Antworten:


71

Verschiedene Browser behandeln dies unterschiedlich. Einige führen den Inhalt nur aus, wenn der srcfehlerfrei enthalten ist. Einige führen es aus, nachdem sie versucht haben, das srcSkript einzuschließen, unabhängig vom Erfolg. Da dieses Verhalten unzuverlässig ist (und in HTML5 verboten ist ), sollte es vermieden werden.

Google verlässt sich nicht auf ein bestimmtes Verhalten. Da der Inhalt nur ein Objektliteral (ein Wert) ist, würde die Ausführung nichts anderes bewirken, als einen stillen Fehler zu verursachen. Der Code von Google überprüft den Inhalt des scriptTags selbst und passt sein Verhalten darauf basierend an.


2
Gibt es eine klügere Möglichkeit für das Skript, den Inhalt seines eigenen Skript-Tags (speziell) anzuzeigen, als das DOM zu durchlaufen?
Karl Knechtel

11
In allen Browsern, mit denen ich gearbeitet habe, wird der Skriptinhalt niemals ausgeführt, wenn das srcAttribut vorhanden ist, und ist eigentlich kein Objektliteral. Dieser Code würde SyntaxErrorbei Ausführung einen "JSON-Text" erzeugen , den das Skript verwendet von selbst später.
CMS

2
@Karl, das in einer externen .js-Datei verwendet wird, gibt Ihnen den Inhalt des aktuell ausgeführten <script> -Knotens: s=document.getElementsByTagName('script'); text = s[s.length-1].innerHTML; Ich glaube, es gibt keine Möglichkeit, den Inhalt eines Skriptknotens abzurufen, bei dem das DOM nicht berührt wird .
Digitalbad

@CMS funktioniert in allen Browsern außer IE. Sie können es hier sehen
Jose Faeti

1
@jose - Ihr Beispiel ist nicht das, worauf sich CMS bezog. Wenn der Code als eigenständige Anweisung ausgeführt wird, handelt es sich um einen Syntaxfehler. Ihr Beispiel (und das von Google) "funktioniert" nur, weil der Inhalt des Skriptelements aufgrund des src- Attributs nicht berücksichtigt wird.
RobG

23

Wenn ein Skriptelement ein src- Attribut hat, muss der Inhalt ignoriert werden, jedes andere Verhalten ist nicht konform.

In Blogs (als Hack) wurde vorgeschlagen, Inhalte in das Element einzufügen , da sie nicht ausgewertet werden. Verwenden Sie dann DOM-Methoden, um den Inhalt als Zeichenfolge abzurufen und entweder zu bewerten oder in ein neues Skriptelement einzufügen. Beides ist keine gute Idee.


4
Warum ist das keine gute Idee? Was ist, wenn es zum Initialisieren eines Plugins eines Drittanbieters verwendet wird?
thekingoftruth

13

Gemäß der HTML5-Entwurfsspezifikation sollten <script>Elemente mit srcAttributen nur auskommentierten Code haben, der eine Dokumentation für das Skript liefern soll. Es scheint jedoch nicht so, als ob Google dieser Spezifikation entspricht.


13

Nachdem das Skript geladen wurde, schaut es in sein eigenes Skript-Tag, um auf seinen Inhalt zuzugreifen.

Es wird ein ähnlicher Code verwendet:

var scripts = document.getElementsByTagName("script");
var data = eval(scripts[scripts.length - 1].innerHTML);

Mit freundlicher Genehmigung von John Resig .

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.