JavaScript in JavaScript einbinden

altmetaller
Goto Top
Hallo,

bitte entschuldigt meine vermutlich saudämliche Frage. Der alte Sack lernt gerade "Programmieren" (in JavaScript). Meine letzten HTML-Erfahrungen stammen noch aus einer Zeit, wo es kein CSS gab :-) face-smile

Hintergrund: Ich habe auf meiner Homepage ein AddOn installiert, umgebaut und angepasst, mit dem ich ein paar Präferenzen setze:
  • ob erforderliche Cookies gesetzt werden dürfen
  • ob Cookies von Google Analytics genutzt werden dürfen
  • ob "Google Ads" angezeigt werden

Ich bin so weit, dass ich ich die Cookies setzen und wieder auswerten kann *stolz*. Hier ein Auszugt aus meinem (Test-)Code:

Das funktioniert perfekt - d.h., die Ausgabe auf der Console stimmt mit den gesetzten Präferenzen überein. Um das Ganze mit Leben zu füllen, möchte ich bei den Statistikcookies den Google Analytics Code einbinden. Dieser sollte laut Google in etwa so aussehen:

Also habe ich das Ganze mal ganz pragmatisch in meinen funktionierenden Code kopiert. Hier das Ergebnis:

...und genau das funktioniert nicht :-( face-sad Offenbar kann man innerhalb eines JavaScript-Blockes kein weiteres JavaScript einbauen.

Was wäre denn hier die "Best practice"?

Liebe Grüße,
Jörg

Content-Key: 612812

Url: https://administrator.de/contentid/612812

Ausgedruckt am: 28.05.2022 um 12:05 Uhr

Mitglied: eisbein
eisbein 15.10.2020 aktualisiert um 07:25:25 Uhr
Goto Top
Guten Morgen,

Ich würde nach deinem Script ein DIV mit id="cookie" einfügen.

und deinen gewünschten Javascript-Code dynamisch da rein schreiben (Zeile 12-19)


Beachte, dass ich den Code als String an innerHTML übergebe und daher ein ' an Anfang und Ende gesetzt habe, da du " bereits verwendest ;-) face-wink
Achte darauf diese Anführungszeichen nicht zu mischen ... (Zeile 17,18)

Habe es aber nicht getestet ...

Gruß
eisbein

EDIT:
Offenbar kann man innerhalb eines JavaScript-Blockes kein weiteres JavaScript einbauen.
Der <script>-Tag ist hier das Problem, da doppelt/verschachtelt ;-) face-wink

EDIT 2:
bitte entschuldigt meine vermutlich saudämliche Frage.
Es gibt selten dumme Fragen, über die Antworten sollte man richten face-devilish
Mitglied: altmetaller
altmetaller 15.10.2020 um 08:40:24 Uhr
Goto Top
Hallo,

ich dachte, <div> steht immer im Body und <script> immer im Head?

Oder schreibe ich das <div> auch in den Head?

Gruß,
Jörg
Mitglied: godlie
Lösung godlie 15.10.2020 um 08:54:05 Uhr
Goto Top
Hallo,

ein <div> gehört in den Body, ein Script kann im Header sein oder auch im Body.

Der Unterschied beim Javascript ist folgender:

Wird das Javascript im Header eingebunden, so wird es am Anfang des Render Prozesses einer Seite ausgeführt, wird es im Body ( am besten ganz unten vor dem schliesenden HTML ), so wird es erst am Ende des Render Prozesses ausgeführt.

Willst du innerhalb deines Javascriptes etwas auf der Seite verändern, musst du warten bis die Seite gerendert ist <-- ergeo sollte das Script ans Ende vom Body.

Hast du nur Funktionen definiert, welche aufgerufen werden aufgrund einer Userinteraktion ( Klick, Hover, Scroll ), kannst du dein Script auch im Header einbinden. Es gibt hier aber noch eine Ausnahme, du kannst dein Script im Header einbinden, aber erst am Ende des Render Prozesses ausführen. Siehe document.ready
Mitglied: altmetaller
altmetaller 15.10.2020 um 09:01:32 Uhr
Goto Top
Hallo,

d.h., wenn ich das <div> direkt vor das Script und beides in den Body schreibe, bin ich „safe“?

Ich mache das über ein Wordpress-AddOn und habe daher nur bedingt Einfluss auf die Positionierung; da ich nicht im Template herummalen will.

Gruß,
Jörg
Mitglied: eisbein
eisbein 15.10.2020 aktualisiert um 09:13:19 Uhr
Goto Top
wenn ich das <div> direkt vor das Script und beides in den Body schreibe, bin ich „safe“?

Was bedeutet "safe"?

Wo steht dein Javascript? - im Header? - dann pack das <div> gleich unter <body>

Gruß
eisbein

Edit:
In deinem HP-Quellcode steht dein Cookie-Code am Ende und im <body> - nach <footer> - also kannst du das <div> gleich nach deinem <script> setzen bzw. den Code direkt mit
hinten anhängen.
Mitglied: altmetaller
altmetaller 15.10.2020 aktualisiert um 09:16:13 Uhr
Goto Top
Hallo,

„safe“ bedeutet: Es funktioniert z.B. auch dann, wenn sich mal etwas verzögert...

in welchem Abschnitt (Head oder Body) das JavaScript steht, kann ich mir aussuchen.

Mein AddOn hat so eine Art Injektor für den Head und den Body. Mit dem möchte ich einmal das Script und einmal das <div> injizieren. Oder halt beides auf einmal...?!?

Das AddOn schreibt seine Einträge immer ans Ende von Head oder Body. Es sei denn, ich pfusche im Template.

Gruß,
Jörg
Mitglied: eisbein
Lösung eisbein 15.10.2020 aktualisiert um 09:49:32 Uhr
Goto Top
in welchem Abschnitt (Head oder Body) das JavaScript steht, kann ich mir aussuchen.

Dann würde ich Head bevorzugen und deinen Google JavaScript Code direkt mit


in den body schreiben, dann benötigst du kein extra <div> .

Edit:
Zum besseren Verständtnis:

in den HEAD und hier wird in Zeile 12 dein Google-Code in den BODY geschrieben.
Mitglied: altmetaller
altmetaller 15.10.2020 um 10:04:13 Uhr
Goto Top
Hallo,

d.h. - pragmatisch ausgedrückt - hängst Du den Scriptcode mit dem Pluszeichen einfach an den Body ran, wobei die doppelten Anführungszeichen verhindern, dass die Anführungszeichen im Scriptcode als Ende des angehängten Codes interpretiert werden?

Gruß,
Jörg
Mitglied: eisbein
eisbein 15.10.2020 aktualisiert um 10:51:08 Uhr
Goto Top
Zitat von @altmetaller:

Hallo,

d.h. - pragmatisch ausgedrückt - hängst Du den Scriptcode mit dem Pluszeichen einfach an den Body ran, wobei die doppelten Anführungszeichen verhindern, dass die Anführungszeichen im Scriptcode als Ende des angehängten Codes interpretiert werden?

Ja

Ich hänge den Scriptcode mit dem Pluszeichen als String an den Body ran, die Anführungszeichen deklarieren den String, wobei man hier aufpassen muss , dass man ' und " im String nicht mischt !!
Daher wäre es ideal im String vorkommende Anführungsziechen mittels \u0022 oder &quot; zu escapen.
https://www.mediaevent.de/javascript/Javascript-Strings.html
Wir reden also nicht von Anführungszeichen - sondern von Hochkommas :-P

In deinem Fall:

Gruß
eisbein
Mitglied: altmetaller
altmetaller 15.10.2020 um 10:56:22 Uhr
Goto Top
Hallo,

1000 Dank! Der alte Sack hat begriffen und Du darfst zuerst spicken - versprochen! :-) face-smile

Gruß,
Jörg
Mitglied: eisbein
eisbein 15.10.2020 um 11:00:03 Uhr
Goto Top
1000 Dank! Der alte Sack hat begriffen und Du darfst zuerst spicken - versprochen!

Gerne :-) face-smile

Gruß
eisbein
Mitglied: altmetaller
altmetaller 15.10.2020 aktualisiert um 16:44:24 Uhr
Goto Top
Hallo,

das funktioniert so nicht. Offenbar ist es nicht möglich, auf diese Weise JavaScript-Code nachzuladen. Ich habe es mal auf ein Beispiel reduziert:


Das Wort "Testabsatz" wird mit Anführungszeichen fehlerfrei ausgegeben. Der Text auf der Konsole müsste eigentlich ohne Anführungszeichen ausgegeben werden. Dieser erscheint aber gar nicht :-( face-sad

Gruß,
Jörg
Mitglied: eisbein
eisbein 15.10.2020 um 18:11:29 Uhr
Goto Top
Wie gesagt, ich habe es nicht getestet.


Hier wird nun dynamisch ein <script> erstellt und mit Text befüllt.

Gruß
eisbein
Mitglied: altmetaller
altmetaller 15.10.2020 um 21:11:20 Uhr
Goto Top
Hallo,

weißt Du was? Ich frage mich gerade ernsthaft, warum ich das nicht mit PHP mache?

Eigentlich brauche ich doch nur im Header - abhängig von den Cookies - den Google-Code mit echo ausgeben, oder?

Gruß,
Jörg
Mitglied: eisbein
eisbein 16.10.2020 um 05:53:59 Uhr
Goto Top
Guten Morgen,

weißt Du was? Ich frage mich gerade ernsthaft, warum ich das nicht mit PHP mache?

Warum einfach, wenn es auch kompliziert geht? :-) face-smile

PHP wäre natürlich um einiges besser.

Dennoch habe ich mit auf deine JavaScript-Frage eingelassen und denke mit createElement sollte es funktionieren. Man lernt immer wieder dazu :-) face-smile

Gruß
eisbein