在html中使用getelementbyid獲取空類型的錯誤

我在簡單的代碼中觸發了，getelementbyid.innerHtml在html頁面中。請幫幫我。在html中使用getelementbyid獲取空類型的錯誤

<!doctype html> 
 
<html lang="en"> 
 
\t <head> 
 
\t \t <title>Dom examples</title> 
 
\t \t <script> 
 
\t \t \t var code = document.getElementById("one").innerHTML; 
 
\t \t \t code = code + " !!"; 
 
\t \t \t console.log(code); 
 
\t \t </script> 
 
\t </head> 
 
\t <body> 
 
\t \t <h4> DOM practise page </h4> 
 
\t \t <p id="one"> This page is for practise of DOM model in JS</p> 
 
\t \t <p id="two"> Thank You </p> 
 
\t </body> 
 
</html>

來源

2017-08-05 Satish Marni

因爲元素編號=一個尚未加載 –

你試過'.innerText'，而不是'.innerHTML'？ – reporter

您的JavaScript調用之前，您的瀏覽器渲染HTML頁面。所以當你的瀏覽器調用getElementById時，ID沒有被定義。

只需在文件末尾移動你的JavaScript

來源

2017-08-05 17:20:35 sheplu

在html標籤之後移動script標籤就足夠了。 – reporter

只需移動下面的腳本...的造成是東陽的ID心不是渲染呢。

<!doctype html> 
 
<html lang="en"> 
 
\t <head> 
 
\t \t <title>Dom examples</title> 
 
\t \t 
 
\t </head> 
 
\t <body> 
 
\t \t <h4> DOM practise page </h4> 
 
\t \t <p id="one"> This page is for practise of DOM model in JS</p> 
 
\t \t <p id="two"> Thank You </p> 
 
\t </body> 
 
    <script> 
 
\t \t \t var code = document.getElementById("one").innerHTML; 
 
\t \t \t code = code + " !!"; 
 
\t \t \t console.log(code); 
 
\t \t </script> 
 
</html>

來源

2017-08-05 17:21:38

我是JS和Html的新手初學者。你的建議幫助了我！非常感謝！！有效：-） –

利用的windowonload屬性來調用一個函數時window加載

<!doctype html> 
 
<html lang="en"> 
 

 
<head> 
 
    <title>Dom examples</title> 
 
    <script> 
 
    onload = function() { 
 
     var code = document.getElementById("one").innerHTML; 
 
     code = code + " !!"; 
 
     console.log(code); 
 
    } 
 
    </script> 
 
</head> 
 

 
<body> 
 
    <h4> DOM practise page </h4> 
 
    <p id="one"> This page is for practise of DOM model in JS</p> 
 
    <p id="two"> Thank You </p> 
 
</body> 
 

 
</html>

來源

2017-08-05 17:22:48 guest271314

只是把腳本部分近身之前，它會w ^掃。

<!doctype html> 
<html lang="en"> 
    <head> 
     <title>Dom examples</title> 
    </head> 
    <body> 
     <h4> DOM practise page </h4> 
     <p id="one"> This page is for practise of DOM model in JS</p> 
     <p id="two"> Thank You </p> 

     <script> 
      var code = document.getElementById("one").innerHTML; 
      code = code + " !!"; 
      console.log(code); 
     </script> 
    </body> 
</html>

來源

2017-08-05 17:22:53 Fr4NgUs

瀏覽器從上到下解析html頁面。因此，如果您將script置於head中，它將首先呈現，然後是body。因此，您的script正在搜索尚未呈現給DOM的ID。

通過將script放置在底部，它可以解決您的問題。

<!doctype html> 
 
<html lang="en"> 
 
\t <head> 
 
\t \t <title>Dom examples</title> 
 
\t </head> 
 
\t <body> 
 
\t \t <h4> DOM practise page </h4> 
 
\t \t <p id="one"> This page is for practise of DOM model in JS</p> 
 
\t \t <p id="two"> Thank You </p> 
 
    <script> 
 
\t \t \t var code = document.getElementById("one"); 
 
\t \t \t code = code.innerHTML + " !!"; 
 
\t \t \t console.log(code); 
 
\t \t </script> 
 
\t </body> 
 
</html>

來源

2017-08-05 17:23:00

這是工作的罰款只是用script標籤中結束。爲了更清晰的檢查。 https://jsfiddle.net/djmayank/Lzewxgyw/

HTML

<head> 
     <title>Dom examples</title> 

    </head> 
    <body> 
     <h4> DOM practise page </h4> 
     <p id="one"> This page is for practise of DOM model in JS</p> 
     <p id="two"> Thank You </p> 
    </body>

var code = document.getElementById("one").innerHTML; 
     code = code + " !!"; 
     console.log(code);

來源

2017-08-05 17:23:49 djmayank

的script裝載裝有一個的ID的元素之前，因此一個尚不存在。您有以下選擇：

你把標籤後，您需要的腳本： <!doctype html> <html lang="en"> <head> <title>Dom examples</title> </head> <body> <h4> DOM practise page </h4> <p id="one"> This page is for practise of DOM model in JS</p> <p id="two"> Thank You </p> <script> var code = document.getElementById("one").innerHTML; code = code + " !!"; console.log(code); </script> </body> </html>
做一個function並使用onload屬性，這是優選的，因爲代碼將是可重複使用的其他功能： <!doctype html> <html lang="en"> <head> <title>Dom examples</title> <script> function myFunction() { var code = document.getElementById("one").innerHTML; code = code + " !!"; console.log(code); } </script> </head> <body> <h4> DOM practise page </h4> <p id="one" onload="myFunction()"> This page is for practise of DOM model in JS</p> <p id="two"> Thank You </p> </body> </html>

來源

2017-08-05 17:29:03

在html中使用getelementbyid獲取空類型的錯誤

回答

相關問題