Dokument.getElementById('id') is null-javascript-Fehler

Aus irgendeinem Grund bekomme ich eine document.getElementById('id') is null JS-Fehler in Zeile 7 mit dem folgenden markup-Code und Skript:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Quadratic Root Finder</title>
<script>
document.getElementById('calculate').onclick = function calculateQuad()
{
    var inputa = document.getElementById('variablea').value;
    var inputb = document.getElementById('variableb').value;
    var inputc = document.getElementById('variablec').value;

    root = Math.pow(inputb,2) - 4 * inputa * inputc;
    root1 = (-inputb + Math.sqrt(root))/2*inputa
    root2 = (-inputb + Math.sqrt(root))/2*inputa 

    document.getElementById('root1').value = root1;
    document.getElementById('root2').value = root2;
    if(root<'0')
    {
        alert('This equation has no real solution.')
    }
    else {
        if(root=='0')
        {
            document.getElementById('root1').value = root1
            document.getElementById('root2').value = 'No Second Answer'
        }
        else {
            document.getElementById('root1').value = root1
            document.getElementById('root2').value = root1
            }
        }
};
document.getElementById('erase').onlick = this.form.reset();
</script>
<style>
#container
{
    text-align: center;
}
</style>
</head>

<body>
<div id="container">
<h1>Quadratic Root Finder!</h1>
<form id="form1">
    a:<input id="variablea" value="" type="text">
    <br/>
    b:<input id="variableb" value="" type="text">
    <br />
    c:<input id="variablec" value="" type="text">
    <br />
    <input id="calculate" value="Calculate!" type="button">
    <input id="erase" value="Clear" type="button">
    <br />
    <br />
    Roots:
    <br />
    <input id="root1" type="text" readonly>
    <br />
    <input id="root2" type="text" readonly>
</form>
</div>
</body>
</html>

Was ist hier das eigentliche problem?

möglich, Duplikat der Warum jQuery oder eine DOM-Methode, wie `getElementById` nicht finden, das element?

InformationsquelleAutor Qcom | 2010-10-12

  1. 6

    Es ist in der Tat null. Ihr element nicht vorhanden ist auf der Seite noch.

    Entweder:

    • Bewegen Sie Ihre <script> block unten Ihren code
    • Hinzufügen window.onload Veranstaltung.

    InformationsquelleAutor Jason McCreary

  2. 2

    Wenn Sie nicht das Gefühl, wie jQuery, dann document.ready = function () {} geht auch.

    InformationsquelleAutor Explosion Pills

  3. 2

    Alternativ: window.onload = function(){} funktioniert auch

    InformationsquelleAutor Azmisov

  4. 0

    Beim Punkt der das javascript ausgeführt wird, gibt es kein element mit der id "berechnen". Sie müssen sicherstellen, dass javascript ausgeführt wird, nachdem Sie Ihre erforderlichen Elemente erstellt wurden. Mein Rat wäre, sich auf einen gemeinsamen javascript-framework wie jquery. Sie würde dann einfach das Skript ausgeführt werden auf dom-ready: 

    $(document).ready(function() {
    //Handler for .ready() called.
});
    Wow, ich vergessen, diese einfachen Fehler, aber jetzt habe ich Sie. Jetzt, da ich darüber nachdenke, jQuery würde diese Auswahl business eine Hölle von viel einfacher, als getElementById Müll die ganze Zeit, aber ich versuche, um die Exposition zu gewinnen, plain, JS, aber ich kann trotzdem mit Ihrer Anregung, thx!
    Es scheint, wie es ist ein riesiger Schub, um jQuery verwenden.
    Ich denke, das ist kein jquery Frage.

    InformationsquelleAutor Zack

  5. 0

    Können Sie beheben Sie, indem Sie das Skript an das Ende des Körpers, oder versuchen Sie es mit window.onload oder window.addEventListenner

    Überprüfen Sie die http://v3.thewatchmakerproject.com/journal/168/javascript-the-dom-addeventlistener-and-attachevent

    und http://javascript.about.com/library/blonload.htm

    InformationsquelleAutor Bang Dao

  6. 0
    1. mit windows.onload
    2. link hinzufügen-Datei-Skript oder das Skript unter "body-end-tag"

    InformationsquelleAutor Anh Tran

Schreibe einen Kommentar