我已经为一个简单的函数内联编写了代码，但是当我创建一个单独的js.file时，由于某种原因它并不想工作。我已经尝试了一切感觉，但是也许我疲倦的眼睛无法解决问题！
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script type="text/javascript" src="menu.js"></script>
</head>
<body>
<div class="container">
<button name="one">Button 1</button>
<p>
Lorem ipsum dolor sit amet
</p>
</div>
<div class="container">
<button name="two">Button 2</button>
<p>
Lorem ipsum dolor sit amet
</p>
</div>
<div class="container">
<button name="three">Button 3</button>
<p>
Lorem ipsum dolor sit amet
</p>
</div>
想法是有三个按钮，当您单击其中一个按钮时，只会显示一个div，而其他两个将被隐藏。
这是JavaScript（内联效果很好）：
var first_container = document.querySelectorAll(' div:not(:first-child) p');
for (var i = 0; i < first_container.length; i++) {
first_container[i].style.visibility = 'hidden';
}
var buttons = document.querySelectorAll('button');
for (var i = 0; i < buttons.length; i++) {
buttons[i].addEventListener('click', clickHandler);
}
function clickHandler(e) {
e.preventDefault();
var text = document.querySelectorAll('p');
for (var i = 0; i < text.length; i++) {
if (text[i] === event.target.nextElementSibling) {
text[i].style.visibility = 'visible';
} else {
text[i].style.visibility = 'hidden';
}
}
}
当您将脚本放入外部文件中，然后从中加载该外部脚本时<head>，它会在DOM准备就绪之前加载。这意味着，如果您的脚本像尝试使用一样尝试引用页面中的document.querySelectorAll()元素，那么这些元素将不存在。
解决该问题的最简单方法是仅移动script标签：
<script type="text/javascript" src="menu.js"></script>
在之前</body>。然后，在脚本运行如下之前，将解析页面的所有元素并在DOM中进行解析：
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<div class="container">
<button name="one">Button 1</button>
<p>
Lorem ipsum dolor sit amet
</p>
</div>
<div class="container">
<button name="two">Button 2</button>
<p>
Lorem ipsum dolor sit amet
</p>
</div>
<div class="container">
<button name="three">Button 3</button>
<p>
Lorem ipsum dolor sit amet
</p>
</div>
<script type="text/javascript" src="menu.js"></script>
</body>
</html>
或者，您可以使用一个脚本，该脚本将在DOM准备就绪时通知您，然后可以调用您的代码。
如果您希望将代码保留在本节中或将其放置在本节中，以便可以将代码放置在任何地方，请参见此参考资料和获得高度评价的答案，以获取纯Java脚本和跨浏览器的等待方式，直到DOM准备就绪为止<head>。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句