.innerHTML: Eigenschaft 'innerHTML' von null kann nicht gesetzt werden

Erstens bin ich völlig neu in der Programmierung und benutze selbstlernende Werkzeuge, um in meiner Freizeit Javascript zu lernen. Ich habe genug gelernt, um mit dem Bau meiner eigenen Projekte zu beginnen. Mein erster Versuch ist es, einen Randomizer zu erstellen (in diesem Fall zufällige Restaurantnamen). Das Javascript funktioniert durch meine Tests in der Konsole ebenso wie die Schaltflächen. Jedoch kann ich nicht scheinen, dass das .innerHTML funktioniert und ich bin nicht sicher, was ich vermisse. Ich habe hier mehrere Suchen durchgeführt und keine der Lösungen, die ich gefunden habe, scheint zu funktionieren..innerHTML: Eigenschaft 'innerHTML' von null kann nicht gesetzt werden

Der Fehler Ich erhalte im Titel aufgeführt wird, und es wird in Zeile 29.

Hier erscheint, ist Javascript:

var randomRestaurant = { 
    restaurantName: [], 
    findRestaurant: function() { 
    var restaurantName = Math.random(); 
    if (restaurantName < 0.20) { 
    this.restaurantName.push("China Taste"); 
    }      
    else if (restaurantName < 0.40) { 
    this.restaurantName.push("Pizza Johns"); 
    } 
    else if (restaurantName < 0.60) { 
    this.restaurantName.push("Liberatore's"); 
    } 
    else if (restaurantName < 0.80) { 
    this.restaurantName.push("Bill Bateman's"); 
    } 
    else { 
    this.restaurantName.push("R&R Taqueria"); 
    } 
}, 
    clearRestaurant: function() { 
    randomRestaurant.restaurantName.splice(0, 1); 
    } 
}; 

var randomRestaurantButton = document.getElementById('randomRestaurantName'); 
randomRestaurantButton.addEventListener('click', function() { 
    randomRestaurant.findRestaurant(); 
    document.getElementById("restaurantNameDisplay").innerHTML = randomRestaurant.restaurantName[0]; //<--line 29 
}); 

var randomRestaurantButton = document.getElementById('refreshRestaurant'); 
randomRestaurantButton.addEventListener('click', function() { 
    randomRestaurant.clearRestaurant(); 
    randomRestaurant.findRestaurant(); 
    document.getElementById("restaurantNameDisplay").innerHTML = randomRestaurant.restaurantName[0]; 
});

Und hier ist mein HTML:

<!DOCTYPE html> 
<html> 

    <head> 
    <link rel="stylesheet" href="style.css"> 

    </head> 

    <body> 
    <div><h1>Random Restaurant!</h1> 

    <button id="randomRestaurantName">Click me for a random restaurant!</button> 
     </div> 
    <br> 

     <h2="restaurantNameDisplay"></h2="restaurantNameDisplay"> 

    <div> 
    <br> 
    <button id="refreshRestaurant">Nah. Give me another one.</button> 
    </div> 

    </body> 
    <script src="script.js"></script> 
</html>

Vielen Dank für Ihre Hilfe und hoffentlich ist es nicht wegen etwas Dummes wie ein Tippfehler.

Quelle

2016-06-04 Riadan414

wahrscheinlich Ihr h2 Element fehlt das ID-Attribut –

Es gibt einige Probleme hier.

die h2-Tag-ID sollte
sein
```
<h2 id="restaurantNameDisplay"></h2> 
```

Ihre Tasten auf der gleichen Variablennamen gesetzt,

var refreshRestaurantButton = document.getElementById('refreshRestaurant'); 
    refreshRestaurantButton.addEventListener('click', function() { 
     randomRestaurant.clearRestaurant(); 
     randomRestaurant.findRestaurant(); 
     document.getElementById("restaurantNameDisplay").innerHTML = randomRestaurant.restaurantName[0]; 
    });

, um die zweite zu ändern, wenn es noch nicht ist, Sie arbeiten Rufen Sie Ihr Skript nach dem Ereignis zum Laden der Seite auf. so Ihren JavaScript-Code auf eine Funktion (zB "myFunc()") einfügen und Ihren HTML-Body-Tag ändern:

body onload = "myFunc()">

Quelle

2016-06-04 14:34:34

Danke! Ich schaue nach und schätze die Hilfe! – Riadan414

Wahrscheinlich diese Linie <h2="restaurantNameDisplay"></h2="restaurantNameDisplay"> sollte <h2 id="restaurantNameDisplay"></h2>

Quelle

2016-06-04 14:28:59 apieceofbart

Lektion gelernt: überprüfen Sie und stellen Sie sicher, dass alle Ihre Tags richtig benannt sind. :) Es ist immer ein dummer Fehler mit mir! Vielen Dank. :) – Riadan414

keine sorgen, machen wir alle diese..also auch die andere Antwort überprüfen, da es wahrscheinlich mehr Probleme mit dem Code gibt. Viel Glück! – apieceofbart

.innerHTML: Eigenschaft 'innerHTML' von null kann nicht gesetzt werden

Antwort

Verwandte Themen