Anzeige

getElementByID füllt nichts hinein

getElementByID füllt nichts hinein | PSD-Tutorials.de

Erstellt von KasselJulian, 14.01.2013.

  1. KasselJulian

    KasselJulian Dude

    Dabei seit:
    30.08.2010
    Beiträge:
    628
    Geschlecht:
    männlich
    getElementByID füllt nichts hinein
    Hallo,

    ich möchte mithilfe eines JavaScripts einem Input einen Wert verpassen.
    Mein Script:
    Code (Text):
    1.  
    2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    3. <html xmlns="http://www.w3.org/1999/xhtml">
    4. <head>
    5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    6. <title>Unbenanntes Dokument</title>
    7. <script>
    8. document.getElementById('hallo').value = "hallo Welt";
    9. </script>
    10. </head>
    11. <body>
    12. <input type="text" id="hallo" />
    13. </body>
    14. </html>
    15.  
    16.  
    Leider wird die Value nicht gesetzt. Woran liegt das?

    Lg
     
    #1      
  2. Myhar

    Myhar Hat es drauf

    Dabei seit:
    01.11.2007
    Beiträge:
    2.075
    Geschlecht:
    männlich
    Ort:
    Ö
    getElementByID füllt nichts hinein
    AW: getElementByID füllt nichts hinein

    Ganz einfach: JS wird in dem Moment ausgeführt, in dem es auf der Seite erscheint. Zum Zeitpunkt deines JS steht folgendes auf deiner Seite:
    HTML:
    1.  
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    4. <title>Unbenanntes Dokument</title>
    5. document.getElementById('hallo').value = "hallo Welt";
    6.  
    Aus diesem HTML Dokument sucht es sich das Element mit der id hallo heraus, findet logischerweise nichts und gibt auch keinem Element den value "hallo Welt".
    Danach wird erst der Rest des Dokuments geladen.
    Deshalb solltest du dein JS erst dann ausführen, wenn die Seite komplett geladen ist (onload)
    Bei einfachen Seiten (wie deiner) reicht es, window.onload zu verwenden.
    HTML:
    1.  
    2. window.onload = function () {
    3.       alert("LOADED!");
    4. }
    5.  
    Dabei ist zu beachten, dass window.onload erst ausgeführt wird, wenn wirklich alles (Bilder, skripte, etc) fertig geladen sind. Dadurch dauert es zwar etwas länger, aber gerade beim lernen können so weniger Fehler entstehen, da auch wirklich alle Ressourcen vorhanden sind.
    Wenn du dann eine "richtige" Seite erstellst, empfiehlt sich, auf DOMReady zu überprüfen, um DOM Manipulationen vorzunehmen. Für Übungsseiten aber deshalb nicht zu empfehlen, da es nicht unbedingt einfach ist, das auf verschiedene Browser abzustimmen.
     
    #2      
  3. KasselJulian

    KasselJulian Dude

    Dabei seit:
    30.08.2010
    Beiträge:
    628
    Geschlecht:
    männlich
    getElementByID füllt nichts hinein
    Logisch. Danke! :)

    Eine Frage dazu noch:

    window.onload = function () { alert("LOADED!"); }Wenn ich jetzt z.B. eine JavaScript-Datei erst bei onLoad ausführen möchte, auf die ich bisher mit script src="" ... verwiesen habe, wie ist das mit deinem Beispiel zu realisieren?
    Zum Beispiel:
    Code (Text):
    1.  
    2. <script type="text/javascript" src="js/example.js">
    3. // File soll absofort erst bei onLoad geladen werden
    4. </script>
    5.  
     
    Zuletzt von einem Moderator bearbeitet: 14.01.2013
    #3      
  4. Myhar

    Myhar Hat es drauf

    Dabei seit:
    01.11.2007
    Beiträge:
    2.075
    Geschlecht:
    männlich
    Ort:
    Ö
    getElementByID füllt nichts hinein
    AW: getElementByID füllt nichts hinein

    Das kannst du nur im JS File selber definieren. In der Datei example.js muss der onload Teil also selber definiert werden. Wenn man 2 js Dateien einbindet, dann kann jede js Datei einen onload Teil haben, die werden dann zusammengefügt.

    by the way: Du brauchst nicht jedesmal meinen Beitrag komplett zitieren ;)
     
    #4      
  5. KasselJulian

    KasselJulian Dude

    Dabei seit:
    30.08.2010
    Beiträge:
    628
    Geschlecht:
    männlich
    getElementByID füllt nichts hinein
    AW: getElementByID füllt nichts hinein

    Ich möchte dich noch um eines fragen :)
    Folgendes:
    Ich habe ein Script das HTML-Elemente nach 1,5 Sekunden des Aufrufs erstellt (mit jQquery setTimeout). Dieser Timeout wird bei meinem window onload event aber nicht berücksichtigt. Sprich ich habe mein Onload-Event, dass trotz dass das jQuery-setTimeout-Event noch nicht abgelaufen ist (sprich die 1,5 Sekunden noch nicht vergangen sind) schon ausgeführt wird.
    Kann ich das umgehen?
    LG
     
    #5      
  6. Duddle

    Duddle Posting-Frequenz: 14µHz

    Dabei seit:
    03.02.2006
    Beiträge:
    3.864
    Geschlecht:
    männlich
    Ort:
    Dresden
    getElementByID füllt nichts hinein
    AW: getElementByID füllt nichts hinein

    Beide Dinge (das Script + dein eigener Event-Handler) laufen parallel ab. Wenn du das nicht willst, musst du eines vom anderen starten lassen.


    Duddle
     
    #6      
  7. KasselJulian

    KasselJulian Dude

    Dabei seit:
    30.08.2010
    Beiträge:
    628
    Geschlecht:
    männlich
    getElementByID füllt nichts hinein
    AW: getElementByID füllt nichts hinein

    Danke! :)
    Das probierte ich vorhin schon einmal, aber scheinbar an der falschen Stelle, denn es bewirkte nichts. Ich habe es direkt nach meinem Code der die HTML-Elemente erzeugt eingeschrieben, sprich innerhalb der Timout-Funktion und nach der Erzeugung der Elemente auf die sich der onLoad-Code bezieht.
    Habe ich da was übersehen?

    Beispiel:
    Code (Text):
    1.  
    2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    3. <html xmlns="http://www.w3.org/1999/xhtml">
    4. <head>
    5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    6. <title>Unbenanntes Dokument</title>
    7. <script type="text/javascript">
    8. $(document).ready(function(){
    9.     setTimeout(function(){
    10.             $("#elemente").load('datei.html', function(responseTxt,status,xhr){
    11.                     if(status != "success"){
    12.                         $("#elemente").html('Fehler');
    13.                     }
    14.                     // Hier kommt mein JavaScript hinein, welches die Elemente, die anhand der datei.html
    15.                     // in #elemente geladen wurden, verändert
    16.                     // z.B. bei Bezug auf ein Input-Feld
    17.                     window.onload = function(){
    18.                         document.getElementById('ID_DIE_IN_DATEI_HTML_VORHANDEN_IST').value = "testvalue";    
    19.                     }
    20.             });
    21.     }, 1500);
    22. });
    23. </script>
    24. </head>
    25. <body>
    26. <div id="elemente">
    27.  
    28. </div>
    29. </body>
    30. </html>
    31.  
    32.  
     
    Zuletzt bearbeitet: 14.01.2013
    #7      
  8. Duddle

    Duddle Posting-Frequenz: 14µHz

    Dabei seit:
    03.02.2006
    Beiträge:
    3.864
    Geschlecht:
    männlich
    Ort:
    Dresden
    getElementByID füllt nichts hinein
    AW: getElementByID füllt nichts hinein

    In deinem Auszug fehlt das eingebundene jQuery, aber das zähle ich mal als Schusselfehler.

    Warum willst du dort ein window.onload machen?
    Möchtest du das Zeug ausführen / die Werte ändern, wenn datei.html erfolgreich geladen wurde? Falls ja, dann brauchst du das nicht nochmal abfragen, da die Funktion die du an load() übergibst doch schon die Callback-Funktion für einen abgeschlossenen Request darstellt. Die Datei ist dann also definitiv geladen (es sei denn, status ist nicht "success").


    Duddle
     
    #8      
  9. KasselJulian

    KasselJulian Dude

    Dabei seit:
    30.08.2010
    Beiträge:
    628
    Geschlecht:
    männlich
    getElementByID füllt nichts hinein
    AW: getElementByID füllt nichts hinein

    Hi,

    das dachte ich auch. Der Status ist zwar success, die Elemente werden jedoch trotzdem nicht gefunden.
     
    #9      
  10. Duddle

    Duddle Posting-Frequenz: 14µHz

    Dabei seit:
    03.02.2006
    Beiträge:
    3.864
    Geschlecht:
    männlich
    Ort:
    Dresden
    getElementByID füllt nichts hinein
    AW: getElementByID füllt nichts hinein

    Dann hast du einen anderen Fehler drin. Bei mir funktioniert es wie erwartet. Sagt Firebug irgendwas?


    Duddle
     
    #10      
x
×
×