Html 我的代码可以在JSFIDLE上运行,但不能在dreamveaver或浏览器上运行?

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>

这是JSfiddle上的链接,工作正常

下面是我为dreamveaver编写的代码,但它不工作,似乎无法调用script.js文件。但不知道为什么

<!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文件位于同一文件夹中?