javascript Datei einbinden - Dateiname in Variable.

[Gerdh]

Hallo, das ganze soll ungefähr so aussehen:

    <script>
      TV_SERVER="http://192.168.178.49/";
      SW_SERVER="http://192.168.178.23/";
      TV_SCHALTER=TV_SERVER+"schalterstellung.js";
      SW_SCHALTER=SW_SERVER+"schalterstellung.js";
    </script>
    <script src=TV_SCHALTER></script>
    <script src=SW_SCHALTER></script>

wobei TV_SERVER und SW_SERVER jeweils ESP8266 sind, die meine Lichtsteuerung schalten sollen. Schreibe ich <script src="http://192.168.178.23/schalterstellung.js"></script> funktioniert es. mfg Gerd

[Robert B.]

Moin Gerd,

du kannst mit JavaScript HTML-Elementknoten erzeugen (wie z.B. script) und Attribute anhängen (wie z.B. src).

Viele Grüße
Robert

[beatovich]

hallo

Hallo, das ganze soll ungefähr so aussehen:

    <script>
      TV_SERVER="http://192.168.178.49/";
      SW_SERVER="http://192.168.178.23/";
      TV_SCHALTER=TV_SERVER+"schalterstellung.js";
      SW_SCHALTER=SW_SERVER+"schalterstellung.js";
    </script>
    <script src=TV_SCHALTER></script>

TV_SCHALTER hat hier nichts mit einer Varible zu tun.

Wenn du ein Script dynamisch erzeugen (ändern) willst, musst du es mit DOM Methoden erzeugen (holen) und einhängen

var script = document.createElement("script"); // oder document.querySelector(some_selector);
script.src = TV_SERVER + "schalterstellung.js";
document.head.appendChild(script);
~~~

-- 
Neu im Forum!
Signaturen kann man ausblenden!

[Gunnar Bittersmann]

@@beatovich

script.src = TV_SERVER + "schalterstellung.js";
~~~

In aktuellen Browsern geht dafür auch

script.src = `${TV_SERVER}schalterstellung.js`;
~~~


LLAP 🖖

-- 
*„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann

[beatovich]

hallo

@@beatovich

script.src = TV_SERVER + "schalterstellung.js";
~~~

In aktuellen Browsern geht dafür auch

script.src = `${TV_SERVER}schalterstellung.js`;
~~~

Richtig, Javascript à la Perl...

[beatovich]

hallo

hallo

@@beatovich

script.src = TV_SERVER + "schalterstellung.js";
~~~

In aktuellen Browsern geht dafür auch

script.src = `${TV_SERVER}schalterstellung.js`;
~~~

Richtig, Javascript à la Perl...

wobei…

_.lineBreaksInVariables=`a



b`;

Hat definitiv einen Vorteil.

Alte Browser, bitte sterbt einfach aus.

[Robert B.]

Hallo beatovich,

script.src = `${TV_SERVER}schalterstellung.js`;
~~~

Richtig, Javascript à la Perl…

Naja, in JavaScript werden hierfür Backticks verwendet, die in Perl doch eine andere Bedeutung haben.

wobei…

_.lineBreaksInVariables=`a



b`;

Hat definitiv einen Vorteil.

Alte Browser, bitte sterbt einfach aus.

Wieso?

Viele Grüße
Robert

[beatovich]

hallo

Hallo beatovich,

script.src = `${TV_SERVER}schalterstellung.js`;
~~~

Richtig, Javascript à la Perl…

Naja, in JavaScript werden hierfür Backticks verwendet, die in Perl doch eine andere Bedeutung haben.

wobei…

_.lineBreaksInVariables=`a



b`;

Hat definitiv einen Vorteil.

Alte Browser, bitte sterbt einfach aus.

Wieso?

Ach den Wiki Artikel darfst du korrigieren

Da steht nämlich

Beispiel

var foo = '<ol>\
<li>First</li>\
<li>Second</li>\
</ol>';

Dieser Ansatz hat den Nachteil, dass er Fehler erlaubt, die man kaum feststellen kann. Im Gegensatz zu obigem Beispiel verursacht folgendes einen Laufzeitfehler:
Beispiel

var foo = '<ol>\ 
<li>First</li>\
<li>Second</li>\
</ol>';

wieso?

Wegen Zahnstochern.

[Robert B.]

Moin beatovich,

man sollte immer noch einen Satz weiterlesen:

Der Unterschied zwischen den beiden Beispielen ist, dass in Letzterem am Ende der ersten Zeile noch ein Leerzeichen steht. \ maskiert somit das Leerzeichen und nicht den Zeilenumbruch.

Du hast es sogar mitkopiert.
Keine Ursache.

Viele Grüße
Robert

[beatovich]

hallo

Moin beatovich,

man sollte immer noch einen Satz weiterlesen:

Der Unterschied zwischen den beiden Beispielen ist, dass in Letzterem am Ende der ersten Zeile noch ein Leerzeichen steht. \ maskiert somit das Leerzeichen und nicht den Zeilenumbruch.

Du hast es sogar mitkopiert.

Warum gibt es dann die Beispiele in dieser Form überhaupt? Ist das ein finde die 7 Unterschiede

in meinem Editor ist im übrigen klar, ob da noch was zwischen Zahn und Bruch stochert.

[Robert B.]

Hallo beatovich,

Warum gibt es dann die Beispiele in dieser Form überhaupt?

Das hast du hier schon mitkopiert (es steht zwischen den Beispielen).

Viele Grüße
Robert

[beatovich]

hallo

Warum gibt es dann die Beispiele in dieser Form überhaupt?

Das hast du hier schon mitkopiert (es steht zwischen den Beispielen).

Es steht am Ende der Beispiele, und wurde nicht mitkopiert.

[Robert B.]

Moin beatovich,

ich meinte folgenden Satz, der deine Frage nach dem Warum beantwortet:

Dieser Ansatz hat den Nachteil, dass er Fehler erlaubt, die man kaum feststellen kann.

Viele Grüße
Robert

[klawischnigg]

Hi there,

In aktuellen Browsern geht dafür auch

script.src = `${TV_SERVER}schalterstellung.js`;
~~~

Interessant. Hab von diesen (jetzt ergoogelten) Template-Literalen vorher noch nie etwas gehört. Wenn ich bis jetzt ein Dollarzeichen in einem js-Code gesehen hab, hab ich nur jQuery-Schei** gesehen und sofort die Ohren angelegt, die Augen verdreht und dann geschlossen. Man lernt halt nie aus...😉

[Gerdh]

Hallo,

ich hab's genau so gemacht. Aber der eingebundene Code var xxx=1; . . . var zzz=2;

wird nicht ausgeführt - soll heißen, meine Variablen sind nicht definiert. Im Debug-Modus von Chrome sehe ich aber, dass er meine schalterstellung.js als source gefunden und mit korrekten Werten hat.

mfg Gerd

[JürgenB]

Hallo,

so einfach geht das mit dem Nachladen von Scripten nicht. Die Variante mit var scr = document.createElement('script'); führt dazu, dass das Script asynchron nachgeladen wird. Die Befahle danach werden also ausgeführt, bevor das Script geladen ist.

Die einfache Lösung, die ich verwendet habe, als mir die asynchrone Programmierung noch nicht geheuer war, ist, das Script-Tag mit document.write zu erstellen.

Die empfehlenswerte Variante, die ich schon seit Jahren verwende, habe ich hier mal gepostet:
https://forum.selfhtml.org/self/2017/feb/6/javascript-funktion-ruft-neues-script-auf-geht-das/1686462#m1686462

Bei dieser Variante musst du aber alles, was mit dem dann asynchron nachgeladenem Script gemacht werden soll, in eine callback-Funktion auslagern.

Gruß
Jürgen

[Rolf B]

Hallo JürgenB,

onload bzw. addEventHandler("load", ...) ist die einfache, übersichtliche und handgemachte Lösung (was keine Abwertung sein soll).

Alternativ kann man, wenn das dynamische Laden in größerem Stil erfolgt, auch Bibliotheken wie require.js einsetzen. Die kombinieren das mit einem Modularisierungskonzept, und für den Produktionsbetrieb kann man auch alles zu einem großen JS Klumpen zusammenpressen lassen. Bedeutet natürlich etwas mehr Lernkurve.

Rolf

[JürgenB]

Hallo Rolf,

… und für den Produktionsbetrieb kann man auch alles zu einem großen JS Klumpen zusammenpressen lassen.

das war für ich nie eine Option, da ich aus drei Gründen nachlade:

• Es gibt nur ein Masterscript, das alles weitere, auch css, nachlädt. Hier könnte man alles „zu einem großen JS Klumpen zusammenpressen lassen“.
• Scripte werden erst und nur dann geladen, wenn sie benötigt werden.
• Nach einem Feature-Request oder einer Parameterauswertung wird entschieden, welche Bibliothek geladen wird.

Gruß
Jürgen

[beatovich]

hallo

var xxx=1; . . . var zzz=2;

wird nicht ausgeführt - soll heißen, meine Variablen sind nicht definiert.

Weil du sie verwendest, bevor sie geladen/initialisiert sind?

Geht's lediglich darum Daten zu laden, so würde ich diese über einen xhr request als JSON-Daten laden.

Wenn die Daten dann angekommen sind, wird eine Prozedur aufgerufen, die dort weitermacht, wo du den xhr erzeugt hast.