[英]Why is document.getElementById() returning a null value when I know the ID exists?
我正在為工作中的CMS模板開發一些自定義Javascript。 我希望能夠在頁面上創建某個<li>元素，只接收該頁面的“當前”類。 所以在全局頁面頭我有這樣的事情：
<script type="text/javascript">
function makeCurrent(id) {
var current = document.getElementById(id);
current.setAttribute("class", "current"); // for most browsers
current.setAttribute("className", "current"); // for ie
}
</script>
然后在每個單獨的頁面<head> ，我有這樣的事情：
<script type="text/javascript">makeCurrent("undergraduate")</script>
在頁面上我有一個nav <ul> ，類似於：
<li id="undergraduate"><a href="...">Undergraduate Program</a></li>
<li id="graduate"><a href="...">Graduate Program</a></li>
etc.
當我加載頁面時，不應用該類。 當我查看Firebug控制台時，它會顯示錯誤消息：
current is null
(x) current.setAttribute("class", "current");
我仍然忙於編寫可靠的原始javascript（在jQuery之后向后學習，你知道它是怎么回事），但我想用JS編寫它。 我正在做什么愚蠢的新手錯誤？
感謝大家！
如果在DOM樹加載完成之前執行javascript，它將返回null。 所以一個想法是在關閉body標簽之前最后調用函數。
這就是為什么大多數JavaScript庫都支持dom-ready事件的原因，現代瀏覽器也支持這種情況（domcontentloaded）但是對於廣泛的瀏覽器支持來說，為自己做這件事有點棘手（好吧，不是那么困難，3或4種不同的方式）我認為。）
在評估該腳本時，該元素尚不存在 。 把它放在body的onload處理程序或者其他東西中，所以它在DOM就位后執行。
如何在不觸及任何標記的情況下執行此操作的示例：
function callWhenLoaded(func) {
if (window.addEventListener) {
window.addEventListener("load", func, false);
} else if (window.attachEvent) {
window.attachEvent("onload", func);
}
}
callWhenLoaded(function() { makeCurrent("undergraduate"); });
如果在makeCurrent運行makeCurrent ，則DOM未完全加載。 你之后，你可以把那個劇本<li>標記。
您的代碼可以優化：您可以使用current.className = 'current';直接設置class屬性current.className = 'current'; 。
原因是您的腳本在頁面加載完成之前運行，因此在填充DOM之前。
您需要確保在頁面加載完成后才調用該函數。 通過使用document.onload（）或body標簽上的onload事件觸發它來完成此操作。
在所有的技術答案已經噴出之后，我將跳過所有那些它本來可能成為的東西並去尋找一些我已經遇到的更明顯的答案，一旦我意識到這一點就讓我面對面：
正如其他人提到的那樣，可能是因為在你引用元素時沒有等待元素可用。
當存在具有該 ID 的元素時，為什么 document.getElementById() 返回 null？
[英]Why is document.getElementById() returning null when there is an element with that Id?
當元素是空文本框時，Javascript document.getElementById("id").value 返回 null 而不是空字符串
[英]Javascript document.getElementById("id").value returning null instead of empty string when the element is an empty text box
document.getElementById（'ID'）是否僅在我的部分代碼中返回null
[英]document.getElementById('ID') is it returning null in only part of my code
document.getElementById（）不斷返回NULL-如何查找值
[英]document.getElementById() keeps returning NULL - how to find value
搜索div ID時Document.getelementbyId返回null
[英]Document.getelementbyId returns null when searching for div id
document.getElementById在單擊按鈕時返回null
[英]document.getElementById is returning null on the button click
CKEditor主體上的Document.getElementById返回null
[英]Document.getElementById on CKEditor body returning null
document.getElementById 每次都返回 null 或 undefined
[英]document.getElementById is returning null or undefined everytime
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.