JavaScript JavaScript Datei einbinden mit Paramtern

Blackbenji · 3. Mai 2017

Hi zusammen,

ich möchte gerne eine Javascript Datei einbinden. Beim Einbinden möchte ich ihr Parameter übergeben.

PHP:

<script defer src="/web/js/reloaded.js" data-url="/reload1" data-tag="#div1"></script>
<script defer src="/web/js/reloaded.js" data-url="/reload2" data-tag="#div2"></script>

Das reloaded.js dazu sieht so aus:

PHP:

window.addEventListener('DOMContentLoaded', function () {
    (function ($) {
        $(document).ready(function () {
            var scripts = document.getElementsByTagName('script');
            var scriptName = scripts[scripts.length-1];

            //do something with b-lazy plugin, lightbox plugin and then with flexslider
            setInterval(function () {
                $.get(scriptName.getAttribute('data-url'), function (result) {
                    $(scriptName.getAttribute('data-tag')).html(result);
                });
            }, 10000);
        });
    })(jQuery);
});

Mein Problem ist nun, das er beim zweiten Aufruf immer den ersten "data" tag/url Wert nimmt.
Vermutlich da es beim Auswerten des DOM der erste Eintrag ist.

Da meine Kenntnisse in JavaScript bescheiden sind, nun die Frage: in welche Richtung muss ich suchen um mein Problem zu lösen?

Einfachster Weg: ich Clone meine JavaScript Datei und nenne die "data"-* einfach um, damit sie eindeutig sind.

Wichtig ist mir die Auslagerung als externe Datei um sie dann mittels "defer" wieder hinein zu laden nachdem jQuery geladen wurde.

Danke und Gruß,
Blackbenji

FranzvonAssisi · 3. Mai 2017

Du gibst den scripts einfach html ids undverwendest dann nicht getElementsByTagName sondern getElementsByID

Ooder du benutzt CSS-Queries

Ooder du benutzt die jquery filter (aka child,...)

Lg, Franz

Bagbag · 3. Mai 2017

Wie wäre es, wenn du es "richtig" machst und eine index.js anlegst, in der du die Funktion 2 mal aufrufst?

Finalspace · 3. Mai 2017

Es gibt noch einen anderen Weg, du definiert einfach eine Methode im Window-Namespace - mit Parametern und rufst die Auf.

Script:

Code:

(function(root, $){
  root.getDataAndUpdateDOM = function(serverUrl, targetTag) {
    // ... do something
  };
}(window, window.jQuery || {}));

Und im HTML:

Code:

<body>
<p id="mytag"></p>
<script src="myscript.js"></script>
<script type="text/javascript">
  $(document).ready(function () {
    window.getDataAndUpdateDOM("https://myurl.whatever.com", "mytag");
  });
</script>
</body>

Übrigens du brauchst kein DOMContentLoaded, weil das die Ready-Funktion für dich macht - so habe ich es zumindest noch im Kopf.

Suche

JavaScript JavaScript Datei einbinden mit Paramtern

Blackbenji

Lieutenant

FranzvonAssisi

Admiral

Bagbag

Commodore

Finalspace

Lt. Junior Grade

Ähnliche Themen