[英]TypeError when calling document.getElementById
以下代碼應顯示單詞Test ...，但顯示消息TypeError：document.getElementById（...）。 我不知道為什么：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Testtree</title>
</head>
<script>
document.getElementById("kaptree").innerHTML="TEST";
</script>
<body>
<div id="kaptree"></div>
</body>
</html>
誰能幫助我睜開眼睛？
您正在嘗試在加載kaptree元素之前對其進行訪問。 加載DOM 后運行腳本。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Testtree</title> </head> <body> <div id="kaptree"></div> <script> document.getElementById("kaptree").innerHTML = "TEST"; </script> </body> </html>
您應該將腳本放在html元素之后。
標識為“ kaptree”的元素在此位置不可用。 將腳本塊移動到身體下方，即可正常工作。
否則，您必須等待文檔就緒狀態。
您的腳本是在您嘗試引用的元素之前定義的。
在以下位置移動它：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Testtree</title>
</head>
<body>
<div id="kaptree"></div>
</body>
<script>
document.getElementById("kaptree").innerHTML="TEST";
</script>
</html>
或更可讀易維護的解決方案，請使用函數：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Testtree</title>
<script>
function changeValue(){
document.getElementById('kaptree').innerHTML='TEST';
}
</script>
</head>
<body>
<div id="kaptree"></div>
<script>changeValue()</script>
</body>
</html>
如果將帶有DIV設置的主體部分移到頂部，它將起作用。
它按順序運行，因此在定義DIV之前無法分配inner.html
因為您的JS代碼在HTML之前被調用。
解決方案1：在</body>標記之前添加JS
例：
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Testtree</title> </head> <body> <div id="kaptree"></div> </body> <script> document.getElementById("kaptree").innerHTML+="TEST"; </script> </html>
解決方案2：在window.load函數中執行JS代碼
例：
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Testtree</title> <script> window.onload = (function(){ document.getElementById("kaptree").innerHTML+="TEST"; }); </script> </head> <body> <div id="kaptree"></div> </body> </html>
A.將腳本放入頭部或身體。
B.將腳本放在#kaptree之后，或添加文檔就緒語句。 您嘗試呼叫尚不存在的內容。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Testtree</title>
<script>
document.addEventListener('DOMContentLoaded', function(){
document.getElementById("kaptree").innerHTML="TEST";
}, false);
</script>
</head>
<body>
<div id="kaptree"></div>
</body>
</html>
有時解決方案是如此簡單。
我將函數調用放入：
$( document ).ready(function() {
});
TypeError：document.getElementById（...）[0]未定義
[英]TypeError: document.getElementById(…)[0] is undefined
傳遞PHP變量時，JavaScript拋出TypeError，document.getElementById
[英]Javascript throwing TypeError, document.getElementById when passed PHP variable
TypeError：document.getElementById（…）; 為空JavaScript
[英]TypeError: document.getElementById(…); is null javascript
TypeError：document.getElementById（…）為null Django + JS
[英]TypeError: document.getElementById(…) is null Django + JS
TypeError：document.getElementById（…）.getElementsByTagName（…）.click不是函數
[英]TypeError: document.getElementById(…).getElementsByTagName(…).click is not a function
Selenium IDE-TypeError：document.getElementById（..）為空
[英]Selenium IDE - TypeError: document.getElementById(..) is null
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.