[JS] JS wird aus der Datei nicht geladen

[シスイ]

Guten Abend zusammen!

Folgendes:
Ich habe ein button:

<button id="button" class="button disabled">Login</button>

Und die folgende Zeile im JS:

document.getElementById("button").onclick = function()
{
    alert("This function is currently disabled!")
}

Mein Problem:
Wenn ich die Zeile aus eine externe .js Datei importieren will, dann klappt es nicht, jedoch wenn ich diese direkt in der HTML-Datei schreibe schon.
An der JS Zeilen liegt es nicht.
Und der Pfad zu meine .js Datei ist auch richtig: (es funktioniert mit andere functions)

<script type="text/javascript" src="design/cds/myscript.js"></script>

Was habe ich übersehen?
Danke!

[Shawak]

Wie schaut dein HTML Code aus wenn du den JS Code als Datei mitsenden willst?

[シスイ]

Originally Posted by Shawak

Wie schaut dein HTML Code aus wenn du den JS Code als Datei mitsenden willst?

Was meinst du denn?
Ich habe dem button einfach eine ID gegeben und diese ID spreche ich in der JS Zeilen an.
Und die JS Datei importiere ich ja über <script> in der HTML-Datei.

Habe mich jedoch danach erinnert dass es noch eine Möglichkeit gibt.
button

<button onclick="functionDisabled()" class="button disabled">Login</button>

function

function functionDisabled()
{
    var x = document.getElementById('button');
    alert("This function is currently disabled!")
}

Ist es so auch gut gelöst?
Oder spricht da was dagegen?

Danke!

[Serraniel]

#moved

[Shawak]

Wenn es so geklappt hat liegt es wahrscheinlich daran, dass du versucht die Funktionen zu hooken bevor das HTML geladen ist.

Versuch mal das hier um deine Implementierung zu machen:

(function () {
    // hier dein code
})();

[Serraniel]

Gehe ich auch davon aus. Zur Validierung kannst du testweise den script Tag mal ganz nach unten ins Dokument packen, sodass das Button Element im DOM Tree schon da ist. Wenns dann geht liegt es daran, dass das Script zu früh ausgeführt wird.

Um das zu verhindern und das Script weiterhin im Head schon zu laden kannst du im script Tag das defer Attribut setzen, damit wird das Script erst ausgeführt, sobald der DOM aus dem HTML komplett aufgebaut wurde. Mehr dazu hier:

[xShizoidx]

Originally Posted by Serraniel

Gehe ich auch davon aus. Zur Validierung kannst du testweise den script Tag mal ganz nach unten ins Dokument packen, sodass das Button Element im DOM Tree schon da ist. Wenns dann geht liegt es daran, dass das Script zu früh ausgeführt wird.

Um das zu verhindern und das Script weiterhin im Head schon zu laden kannst du im script Tag das defer Attribut setzen, damit wird das Script erst ausgeführt, sobald der DOM aus dem HTML komplett aufgebaut wurde. Mehr dazu hier:

Das defer Attribut wird erst ab IE 10 unterstützt, daher würde ich es nicht unbedingt werden. Mach dein <script src=""></script> vor dem schließenden Body Tag.

[False]

Originally Posted by xShizoidx

Das defer Attribut wird erst ab IE 10 unterstützt, daher würde ich es nicht unbedingt werden. Mach dein <script src=""></script> vor dem schließenden Body Tag.

Ganz ehrlich wer auf IE Kompatibilität achtet hat selber schuld

[Serraniel]

Originally Posted by xShizoidx

Das defer Attribut wird erst ab IE 10 unterstützt, daher würde ich es nicht unbedingt werden.

IE10...mit <1 bis 2% Marktanteil (je nach Quelle). Jetzt überleg mal wie gering der Anteil der Browser ist, die noch älter sind. Ich denke so einen geringen Prozentanteil kann man getrost ignorieren. Windows Mobile wurde schon bei höheren (wenn auch nicht viel höheren) Marktanteilen von den meisten App Entwicklern vernachlässigt.

[xShizoidx]

Originally Posted by .ƒaℓsє.

Ganz ehrlich wer auf IE Kompatibilität achtet hat selber schuld

Originally Posted by Serraniel

IE10...mit <1 bis 2% Marktanteil (je nach Quelle). Jetzt überleg mal wie gering der Anteil der Browser ist, die noch älter sind. Ich denke so einen geringen Prozentanteil kann man getrost ignorieren. Windows Mobile wurde schon bei höheren (wenn auch nicht viel höheren) Marktanteilen von den meisten App Entwicklern vernachlässigt.

Wer z.B. für Kunden entwickelt, sollte zumindest darauf achten, dass der Internet Explorer Version 9 keine Probleme damit hat. "Den ältesten Browser in einer Firma hat immer der Chef. Immer." (Zitat von ) Einige Agentur achten noch darauf, dass ab IE 8 unterstützt wird, andere erst ab IE 9. Moderne Shopsysteme sorgen auch oft dafür, dass der Internet Explorer Version 9 bei denen läuft. Auch ältere Smartphones, wie es z.B. einige Senioren haben, werden damit Probleme haben, deshalb würde ich schon etwas darauf achten. Man muss unterscheiden , ob man gezwungen ist auf moderne Browser zu setzen, weil man bei alten Browsern gewisse Features nicht hat oder ob man dies umgehen kann. In diesem Fall muss man halt nicht auf die alten Browser verzichten, warum sollte er also irgendwelche script Attribute nehmen, welche nur von älteren Browser unterstützt werden , wenn es auch ohne geht ?

[False]

Originally Posted by xShizoidx

Wer z.B. für Kunden entwickelt, sollte zumindest darauf achten, dass der Internet Explorer Version 9 keine Probleme damit hat. "Den ältesten Browser in einer Firma hat immer der Chef. Immer." (Zitat von ) Einige Agentur achten noch darauf, dass ab IE 8 unterstützt wird, andere erst ab IE 9. Moderne Shopsysteme sorgen auch oft dafür, dass der Internet Explorer Version 9 bei denen läuft. Auch ältere Smartphones, wie es z.B. einige Senioren haben, werden damit Probleme haben, deshalb würde ich schon etwas darauf achten. Man muss unterscheiden , ob man gezwungen ist auf moderne Browser zu setzen, weil man bei alten Browsern gewisse Features nicht hat oder ob man dies umgehen kann. In diesem Fall muss man halt nicht auf die alten Browser verzichten, warum sollte er also irgendwelche script Attribute nehmen, welche nur von älteren Browser unterstützt werden , wenn es auch ohne geht ?

Arbeite in der Webentwicklung und kann dir sagen das keiner unserer Kunden den IE unterstützt haben will.
Der IE brauch einfach so extrem viele bugfixes, gerade wenn man javascript-libs nutzt das die Kosten extrem in die höhe steigen.
Ich persönlich würde es auch nicht anders machen, IE ist einfach nur müll und da es eh nur so ein kleiner Prozentsatz ist die den IE nutzen (und davon auch nur einige Prozent die Webanwendung nutzen werden) können wir/ich getrost drauf verzichten.

Meist wird einfach auf IE geprüft und auf ein Download für Firefox/Chrome verwiesen.

[xShizoidx]

Originally Posted by .ƒaℓsє.

Arbeite in der Webentwicklung und kann dir sagen das keiner unserer Kunden den IE unterstützt haben will.
Der IE brauch einfach so extrem viele bugfixes, gerade wenn man javascript-libs nutzt das die Kosten extrem in die höhe steigen.
Ich persönlich würde es auch nicht anders machen, IE ist einfach nur müll und da es eh nur so ein kleiner Prozentsatz ist die den IE nutzen (und davon auch nur einige Prozent die Webanwendung nutzen werden) können wir/ich getrost drauf verzichten.

Meist wird einfach auf IE geprüft und auf ein Download für Firefox/Chrome verwiesen.

Ja, mag ja auch richtig sein. Es kommt aber auf die Branche an bzw. das Unternehmen an, für welches die Person später arbeitet. Sicher wird bei großen Webanwendungen auf alte IE Versionen aus Kostengründen verzichtet, weil es viel zu aufwändig wäre. Bezüglich der Marktanteile :
- Bei dem Großhandelsshop meines Arbeitgebers liegen die IE Anteile bei knapp 15%. Liegt aber auch daran, dass dort viele Personen einkaufen, welche nur einen stationären Handel haben und keine Ahnung von Computern, etc. haben und froh sind, wenn die überhaupt irgendwie ins Internet kommen.
- Bei einem Sanitätshandel, wo ich einmal ein Vorstellungsgespräch hatte, war der Marktanteil von alten IE´s und alten Smartphones auch höher , weil die Damen , welche sich im Inet Inkontinenzschlüpfer kaufen, sicherlich kein modernen Browser haben und dort wurde ab IE 8 optimiert.
Es ist halt stark von der Branche und dem Alter der Personen abhängig. Shopsoftware wird meist auch ab IE 9 optimiert und man muss nicht unnötig irgendwelche Sachen verwenden, wenn es auch ohne geht, außer es ist notwendig ( zum Großteil wird man dort sowieso nur mit jQuery etwas machen und evtl. paar Ajax Requests ). Dort macht es einfach kein Sinn den IE9 im Stich zu lassen und stattdessen dem Benutzer anzugeben, dass er sich einen anderen Browser downloaden soll, wobei der Kunde im Einzelhandel warscheinlich das sowieso nicht machen wird und stattdessen die Seite verlassen wird. Wenn er große Bibliotheken verwendet, welche das nicht mehr unterstützen und der Aufwand viel höher wäre, kann er das ja machen, ansonsten macht es aber echt keinen Sinn.

[シスイ]

Einen wunderschönen guten Abend euch allen!

Danke für die schöne Auseinandersetzung. Konnte noch einiges dazu lernen, durch eure Diskussion.

Habe jetzt ein weiteres Problem. Habe nun einiges an JavaScript gelernt und bin rüber zu jQuery gegangen.
Nun habe ich ein Problem. Ähnlich wie beim ersten Mal.

Meine .html Datei:

 Spoiler

import:

  <script type="text/javascript" src="design/cds/myscript.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

die betroffene Zeilen:

        <section class="wrapper">
          <section class="ads adA">&nbsp; <label id="ads_tst"> Your AD here </label></section>
          <section class="ads adB">&nbsp; <label id="ads_tst"> Your AD here </label></section>
          <section class="ads adC">&nbsp; <label id="ads_tst"> Your AD here </label></section>
        </section>

Meine jQuery Zeilen:

 Spoiler

        $(document).ready(function(){
            $(".ads").click(function(){
                alert("The paragraph was clicked.");
            });
        });

Das Problem: Wenn ich mein jQuery Code direkt in der HTML-Datei mit 'script' ausführe, dann klappt alles.
Sobald ich es in der .js Datei verschiebe, wird es nicht mehr ausgeführt.

Es kann nicht an der Verlinkung liegen, denn in der .js Datei habe ich noch mehr Code, welches aber ausgeführt wird.

[False]

Originally Posted by シスイ

Einen wunderschönen guten Abend euch allen!

Danke für die schöne Auseinandersetzung. Konnte noch einiges dazu lernen, durch eure Diskussion.

Habe jetzt ein weiteres Problem. Habe nun einiges an JavaScript gelernt und bin rüber zu jQuery gegangen.
Nun habe ich ein Problem. Ähnlich wie beim ersten Mal.

Meine .html Datei:

 Spoiler

import:

  <script type="text/javascript" src="design/cds/myscript.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

die betroffene Zeilen:

        <section class="wrapper">
          <section class="ads adA">&nbsp; <label id="ads_tst"> Your AD here </label></section>
          <section class="ads adB">&nbsp; <label id="ads_tst"> Your AD here </label></section>
          <section class="ads adC">&nbsp; <label id="ads_tst"> Your AD here </label></section>
        </section>

Meine jQuery Zeilen:

 Spoiler

        $(document).ready(function(){
            $(".ads").click(function(){
                alert("The paragraph was clicked.");
            });
        });

Das Problem: Wenn ich mein jQuery Code direkt in der HTML-Datei mit 'script' ausführe, dann klappt alles.
Sobald ich es in der .js Datei verschiebe, wird es nicht mehr ausgeführt.

Es kann nicht an der Verlinkung liegen, denn in der .js Datei habe ich noch mehr Code, welches aber ausgeführt wird.

Kleiner Tipp: Beim entwickeln mit Jquery/Javascript immer die Console offen lassen damit du Fehler siehst.

Hättest du den oben genannten Tipp befolgt hättest du ein Fehler gesehen wir "$ is not defined" o.ä. !
Du lädst erst dein Script und dann Jquery, somit weißt dein Browser nicht was $ ist.
(Somit hat es doch was mit der "verlinkung" zu tun )

Lösung: Jquery immer als erstes laden.

[シスイ]

Originally Posted by .ƒaℓsє.

Kleiner Tipp: Beim entwickeln mit Jquery/Javascript immer die Console offen lassen damit du Fehler siehst.

Hättest du den oben genannten Tipp befolgt hättest du ein Fehler gesehen wir "$ is not defined" o.ä. !
Du lädst erst dein Script und dann Jquery, somit weißt dein Browser nicht was $ ist.
(Somit hat es doch was mit der "verlinkung" zu tun )

Lösung: Jquery immer als erstes laden.

Du hattest recht (aber das weißt du ja schon).
Ich wusste gar nicht, dass es eine Rolle spielt, was man als erstes laden lässt.

Gibt es dabei, beim verlinken, noch andere Besonderheiten die man beachten muss, außer die die du jetzt genannt hast?

Danke!