Felix Riesterer: Wiki: Problem mit eingebundenen Skripten

Beitrag lesen

Meta

Wiki: Problem mit eingebundenen Skripten

Felix Riesterer Homepage des Autors
+1 Informationen zu den Bewertungsregeln

problematische Seite

Lieber JürgenB,

eingebundenen Scripten. Diese werden in der Frickl-Ansicht nicht geladen.

das ist so gewollt. Hier eine Lösung, die ich gerade mit der Frickl-Ansicht erfolgreich ausprobiert habe:

"use strict";

// load library
(function () {
    var s = document.createElement("script");
    s.src = "/extensions/Selfhtml/example.php/Beispiel:JS-Anw-FktPlot-grafik_canvas.js";
    s.type = "text/javascript";
    document.getElementsByTagName("head")[0].appendChild(s);
}());

// setup
window.addEventListener("load", function () { ... });

Die Lösung besteht darin, das "load"-Event anstelle des "DOMContentLoaded"-Events zu verwenden, damit der Browser mit dem eigentlichen Script darauf wartet, bis alle Komponenten geladen worden sind und das SW-Objekt zur Verfügung steht. Zuvor habe ich mit einer IIFE ein passendes <script> in den <head> geschrieben, damit Deine Bibliothek in der Frickl-Vorschau tatsächlich verfügbar ist.

Der Hintergrund zu der Entscheidung bei der Frickl-Umsetzung so vorzugehen ist der, dass externe Bibliotheken nicht einfach unsichtbar im Frickl verfügbar sein sollen, sondern dass ihr Vorhandensein im JavaScript-Code nachvollziehbar verursacht wird.

Mir leuchtet jetzt nicht ein, warum ein Äquivalent mit jQuery zu obiger IIFE nicht funktioniert (das <script> wird korrekt eingefügt, aber die Bibliothek wird nicht geladen):

$(
  '<script src="/extensions/Selfhtml/example.php/Beispiel:JS-Anw-FktPlot-grafik_canvas.js" type="text/javascript">'
).appendTo("head");

Ebenso gelingt es nicht, die innerHTML-Eigenschaft zu "missbrauchen", die Bibliothek wird nicht geladen, obwohl das <script> korrekt ins DOM eingefügt wird:

document.getElementsByTagName("head")[0].innerHTML += '<script src="/extensions/Selfhtml/example.php/Beispiel:JS-Anw-FktPlot-grafik_canvas.js" type="text/javascript"></'
  + "script>";

Nur durch die DOM-Methode appendChild wird der Browser offensichtlich dazu veranlasst, die Bibliothek zu laden...

Getestet im Firefox.

Liebe Grüße,

Felix Riesterer.

Beitrag melden
+1
Informationen zu den Bewertungsregeln