Javascript can't get html value or getting undefined value in javascript(two cases)

Lionsure 2020-06-01 Original by the website

Sometimes when using javascript to get the value of html element, I find that the value is always not got. I don't know the reason, and it may not be solved for a long time. There are several situations when you can't get the value with javascript.

 

1. Case one of javascript can't get html value: Javascript is placed in front of the element to be got

When javascript is placed in front of the element to be got, when it is executed, because the element to be got has not been loaded, it cannot find this element, cause the element can't be got. Examples are as follows:

<!DOCTYPE html>
       <html>
       <head>
              <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
              <title>Javascript can't get html value or getting undefined value in javascript</title>
              <style type="text/css">
                     .content{
                            width:500px;
                            overflow:hidden;
                            border:1px solid #ddd;
                     }
                     .show{display:block;}
                     .hide{display:none;}
              </style>
       </head>
       <body>
              <div class="content">
                     <div id="test" class="hide"><a href="http://www.liangshunet.com/pub/Items.aspx?t=pdjs&tn=Javascript" >Javascript</a></div>
              </div>
              <script type="text/javascript" language="javascript">
                     function init(){
                            var obj = document.getElementById("test");
                            if(obj.className == "hide")
                                   obj.className = "show";
                            alert(obj.innerHTML);
                     }
                     init();
              </script>
       </body>
       </html>

In the example, if you put init() in front of the<div id="test" class="hide"> to be got, you cannot get it, but change function init() to window.onload = function(), you can get its value no matter before or after it, pay attention to remove the init().

 

2. Case two of javascript can't get html value: The referenced file is incorrect and cannot get the value

If you put the javascript code in the above source code into a javascript file, the reference like the following will not get the value.

<script type="text/javascript" language="javascript" src="getval.js" />

 

It must be quoted like this:

<script type="text/javascript" language="javascript" src="getval.js"></script>

In other words, the reference to javascript file cannot use "/>" to indicate the end of element like other elements. If you want to get the value of html element when loading, the statement referencing the javascript file should also be placed after the html element, otherwise you can't get the value.