我正在尝试使用 index.html 文件和 script.js 文件运行几行简单的代码，仅此而已。
在 HTML 文件中，我有 doctype html:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="javascript/script.js"></script>
</head>
<body>
<div id="content1">This is content 1 </div>
<div id="content2">This is content 2 </div>
<div id="content3">This is content 3 </div>
</body>
</html>
对于我的 javascript 部分，我有:
var elems = $("div");
if (elems.length) {
var keep = Math.floor(Math.random() * elems.length);
for (var i = 0; i < elems.length; ++i) {
if (i !== keep) {
$(elems[i]).hide();
}
}
}
当我在 CodePen 中运行它时，甚至在本网站的代码编辑器上运行时，它工作正常。但是当我在桌面上使用文件时它不起作用(index.html，script.js 我相信文件夹结构是正确的(script.js 在 javascript 文件夹中。)
谢谢大家
最佳答案
将您的脚本标签移动到 body 标签结束之前:
<script src="javascript/script.js"></script>
</body>
这样 DOM 将在您的脚本运行时可用。
如果您希望将脚本保留在 head 部分，则将您的代码包装在 DOMContentLoaded 事件处理程序中:
document.addEventListener("DOMContentLoaded", function() {
var elems = $("div");
if (elems.length) {
var keep = Math.floor(Math.random() * elems.length);
for (var i = 0; i < elems.length; ++i) {
if (i !== keep) {
$(elems[i]).hide();
}
}
}
});
...以便在 DOM 准备就绪时运行您的代码。
你没有用 jquery 标记你的问题，但你似乎在使用它，你可以使用这个较短的代码来做与上面基本相同的事情:
$(function() {
var $elems = $("div").hide(),
$elems.eq(Math.floor(Math.random() * $elems.length)).show();
});
关于javascript - 代码在 Codepen 中有效，但不适用于我的桌面文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43402675/