Das Script-Tag

Ich habe eine tolle Frage vom Leser Josh Kreis erhalten

Mir ist aufgefallen, dass es bei einem <script>-Tag alle möglichen Variationen gibt, die alle browserübergreifend zu funktionieren scheinen. Was ist notwendig und was nicht?

<script>
  //some javascript here
</script>

<script type="text/javascript">
  //some javascript here
</script>

<script type="text/javascript" language="javascript">
  //some javascript here
</script>

<script language="javascript">
  //some javascript here
</script>

<script type="text/javascript">
  //<![CDATA[
    // some javascript here
  //]]>
</script>

Das ist der Stand der Dinge, soweit ich das verstehe. Wenn jemand etwas hinzufügen oder mich korrigieren möchte, wenn ich falsch liege, bitte tun Sie das in den Kommentaren.

/* WAY OLD - DO NOT USE */

<script language="javascript">
  //some javascript here
</script>

Es gab nie wirklich ein language-Attribut (oder wenn, dann ist es längst veraltet). Es gibt ein lang-Attribut, aber das dient einem völlig anderen Zweck: die menschliche Sprache zu identifizieren, nicht die Computersprache. Diese Syntax mit dem language-Attribut diente dazu, (älteren) Browsern mitzuteilen, dass sie das Skript als JavaScript identifizieren und ausführen sollen. Es funktionierte früher, war aber nie Standard.

Jetzt haben wir eine standardisierte Methode dafür

<script type="text/javascript">
  //some javascript here
</script>

Das type-Attribut ist der Standard und der korrekte Weg, um dem Browser mitzuteilen, welche Art von Skript das Tag enthält. Manchmal sehen Sie Code, der sowohl das language- als auch das type-Attribut verwendet. Soweit ich weiß, ist das nie notwendig.

Wirklich spezifische Erklärung aus der Spezifikation, language ist ein "veraltetes, aber konformes" Feature

Autoren sollten kein language-Attribut auf einem Skriptelement angeben. Wenn das Attribut vorhanden ist, muss sein Wert eine ASCII-Groß-/Kleinschreibung-unabhängige Übereinstimmung mit der Zeichenkette "JavaScript" sein und entweder das type-Attribut muss weggelassen werden oder sein Wert muss eine ASCII-Groß-/Kleinschreibung-unabhängige Übereinstimmung mit der Zeichenkette "text/javascript" sein. Das Attribut sollte stattdessen vollständig weggelassen werden (mit dem Wert "JavaScript" hat es keine Auswirkung) oder durch die Verwendung des type-Attributs ersetzt werden.

In jüngerer Zeit haben Sie wahrscheinlich viel von diesem hier gesehen

<script>
  //some javascript here
</script>

Keine Attribute. Das ist der HTML5-Weg, Skript-Tags mit JavaScript zu handhaben. Es wird einfach davon ausgegangen, dass der Typ text/javascript ist. Wenn das nicht der Fall ist (ich habe noch nie einen anderen Skripttyp gesehen), müssen Sie ihn mit dem type-Attribut ändern. Das empfehle ich, wenn Sie HTML5 verwenden.

Noch eine seltsame Sache

<script type="text/javascript">
  //<![CDATA[
    $("<div />").appendTo("body"); // Some JS with HTML in it.
  //]]>
</script>

FALLS Sie immer noch XHTML verwenden und FALLS Ihr JavaScript HTML enthält (oder sogar nur das <-Zeichen, wie es bei Greater-than-Logik erforderlich sein könnte), benötigen Sie diese CDATA-Kommentare um das Skript herum, FALLS Sie möchten, dass das Skript die Validierung besteht (Sie erhalten eine Fehlermeldung wie: Dokumenttyp lässt Element "div" hier nicht zu). UND FALLS Sie Skript buchstäblich zwischen den öffnenden und schließenden Skript-Tags einfügen, anstatt eine Skriptquelle (src) zu verlinken.

Das sind viele WENN-Fälle.

Fazit

• Wenn Sie HTML5 verwenden, verwenden Sie einfach <script>.
• Wenn Sie etwas Älteres verwenden, verwenden Sie <script type="text/javascript">.
• Wenn Sie Skripte für die Verwendung auf fremden Websites schreiben (z. B. Copy-Paste-Code, WordPress-Plugins usw.), verwenden Sie <script type="text/javascript"> und CDATA.