Geek Answers Handbook

Document.getElementById () not working?

Nothing to say,

<html>
    <body>
        <script>
            var x = document.getElementById('btn1');
            alert(x);
        </script>
            <input type="button" id="btn1" value="Clickme" onclick="alert('1')" />
    </body>
</html>

A warning message nullinstead of a message contains information about the object or something like that.

What is the problem?

+4
source share
7 answers

Put your script AFTER the actual element, otherwise by the time you run your javascript code, there is no such element in the DOM yet.

<html>
    <body>
        <input type="button" id="btn1" value="Clickme" onclick="alert('1')" />
        <script>
            var x = document.getElementById('btn1');
            alert(x);
        </script>
    </body>
</html>

Alternatively, put your script in the DOM ready event to make sure the DOM is fully loaded by the browser before trying to manipulate it:

<html>
    <body>
        <script>
            window.onload = function() {
                var x = document.getElementById('btn1');
                alert(x);
            };
        </script>
        <input type="button" id="btn1" value="Clickme" onclick="alert('1')" />
    </body>
</html>
+21
source

You need to run javascript after html s read / rendered ...

Try this instead:

<html>
    <body>
        <input type="button" id="btn1" value="Clickme" onclick="alert('1')" />
        <script>
            var x = document.getElementById('btn1');
            alert(x);
        </script>
    </body>
</html>

, script . :

<html>
    <body>
        <script>
            window.onload = function(){
                var x = document.getElementById('btn1');
                alert(x);
            }
        </script>
            <input type="button" id="btn1" value="Clickme" onclick="alert('1')" />
    </body>
</html>
+5

, dom . script a ,

<html>
    <body>

        <input type="button" id="btn1" value="Clickme" onclick="alert('1')" />
        <script>
            var x = document.getElementById('btn1');
            alert(x);
        </script>
    </body>
</html>

DEMO

0

Javascript . alert(x) input#btn1. :

window.onload = function() {
    var x = document.getElementById('btn1');
    alert(x);
}
0

script, id #btn1, dom. , script .

,   

    <input type="button" id="btn1" value="Clickme" onclick="alert('1')" />
    <script>
        var x = document.getElementById('btn1');
        alert(x);
    </script>
</body>

0
<script type="text/javascript">
     function call()
     {
        var x = document.getElementById('btn1').value.trim();//or use "=<%btn1.ClientID%>"
        alert(x);
     }
      </script>

onClientClick .

0
window.addEventListener('DOMContentReady',function(){
    var x = document.getElementById('btn1');
    alert(x);
};

"DOMContentReady" , "window.onload", .

0

More articles:


All Articles