Html 我的代码可以在JSFIDLE上运行,但不能在dreamveaver或浏览器上运行?
这是JSfiddle上的链接,工作正常 下面是我为dreamveaver编写的代码,但它不工作,似乎无法调用script.js文件。但不知道为什么Html 我的代码可以在JSFIDLE上运行,但不能在dreamveaver或浏览器上运行?,html,jsfiddle,Html,Jsfiddle,这是JSfiddle上的链接,工作正常 下面是我为dreamveaver编写的代码,但它不工作,似乎无法调用script.js文件。但不知道为什么 <!doctype html> <html> <head> <title>lab1</title> <script type= "text/javascript" src="script.js"></script> </head> <body>
<!doctype html>
<html>
<head>
<title>lab1</title>
<script type= "text/javascript" src="script.js"></script>
</head>
<body>
First name:
<input type="text" id="newfruit">
<br>
<h1> Fruit Shelf:</h1>
<div id="div1">
<ol id="fruits"></ol>
</div>
<h1>Basket:</h1>
<ol id="basket"></ol>
<input type='button' onclick='changeText2()' value='Submit' />
</body>
</html>
这是javascript文件
var list = document.getElementById('basket');
var fruitsshelf = document.getElementById("fruits");
var fruitslist = ["pear", "apple", "peach", "grapes", "strawberry", "melon"];
for (var j = 0; j < fruitslist.length; j++) {
var newlist = document.createElement('li');
newlist.id = 'listid'+j;
newlist.appendChild(document.createTextNode(fruitslist[j]));
fruitsshelf.appendChild(newlist);
}
function changeText2() {
var newfruit = document.getElementById('newfruit').value;
var entry = document.createElement('li');
var len = fruitslist.length;
for (var i = 0; i < len; i++) {
if (fruitslist[i] == newfruit) {
entry.appendChild(document.createTextNode(newfruit));
list.appendChild(entry);
document.getElementById("listid"+i).remove();
delete fruitslist[i];
}
}
}
您需要将JavaScript放在页面的末尾,或者将其包装在windowonload事件中,这是jsFiddle默认的做法。按照现在的方式,您正在尝试对尚不存在的元素执行JavaScript。您的fiddle在结束body元素之前加载代码,而您上面的示例没有这样做
移动到之前。您是否仔细检查了script.js文件是否与HTML文件位于同一文件夹中?