的Javascript只有工作時HTML文檔

我一直想有一個數組填充一個下拉里面，我得到了這個職位這方面的例子：JavaScript - populate drop down list with array 的Javascript只有工作時HTML文檔

我使用這個網站：

<select id="selectNumber"> 
<option>Choose a number</option> 
</select>

用這個js

var select = document.getElementById("selectNumber"); 
var options = ["1", "2", "3", "4", "5"]; 

for(var i = 0; i < options.length; i++) { 
var opt = options[i]; 
var el = document.createElement("option"); 
el.textContent = opt; 
el.value = opt; 
select.appendChild(el); 
}

但是，如果我把HTML文檔裏面的JS它僅適用，如果我把它放在一個單獨的文件，它給了我這個errror在Chrome：

>Uncaught TypeError: Cannot read property 'appendChild' of null at g.js:8

我也tryed這一個，但同樣的事情發生：

var select = document.getElementById("selectNumber"); 
var options = ["1", "2", "3", "4", "5"]; 

for(var i = 0; i < options.length; i++) { 
var opt = options[i]; 
var el = document.createElement("option"); 
el.text = opt; 
el.value = opt; 
select.add(el); 
}

的代碼只有當我把它放在HTML文件中工作，但如果我有它在一個單獨的文件，它給了我這個錯誤。

任何想法爲什麼？

來源

2017-05-24 pumsho

總結你的代碼（https://developer.mozilla.org/en/docs/Web/Events/DOMContentLoaded）和引用的JS文件在後DOM元素 – Satpal

你用'jquery'標記了這個，但似乎沒有使用它？ – trincot

你應該在正文的最後加載js文件。這將確保您正在查找的元素存在於您的DOM中。

這可以通過使用一個準備檢查來避免。本地JavaScript例如：

document.addEventListener("DOMContentLoaded", function(event) { 
    //do work 
});

來源

2017-05-24 13:51:41

-2

<script src="filename.js"></script>

嘗試在頭標記加入這個如果問題無法解決，請確保你已經把JS文件在同一文件夾中的HTML文件的

來源

2017-05-24 13:53:25

你可以看到JS正在加載，所以OP必須加載JS。這個問題可能與已經在其他答案中提到的腳本加載時沒有準備好的事實有關 –

的JQuery我的代碼可以訪問dom }）

來源

2017-05-24 13:54:45

嘗試使用[DOMContentLoaded]

$(document).ready(function() { 
    //set your code 
});

來源

2017-05-24 13:55:19 Jay

的Javascript只有工作時HTML文檔

回答

相關問題