首先，我是一个新手。我一直在尝试创建一个JS文件来包含我在HTML文件中使用的所有文本变量（以及其他函数）。我的JS文件与我的HTML文件（C：/ websites / first）位于同一目录中。我的CSS文件已经链接并且工作正常，让我对为什么这不起作用感到困惑。
我尝试过这些帖子和其他一些人的答案，但没有运气：
Set content of HTML <span> with Javascript
How do I change the text of a span element in JavaScript
How to pass Variable from External JavaScript to HTML Form
我在这里要做的是设置我的
来包含我的全名var。一旦我得到了这个，我的其他问题也应该得到解决。
这是我的JS的片段：
var fullname = "example";
document.getElementById('fullname').innerHTML = fullname;
和我的HTML片段：
<html>
<head>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<p id="fullname"></p>
</body>
</html>
我找不到我做错了什么。我一直在扯掉头发，因为它很简单，但我找不到解决办法。
答案 0 :(得分：8)
将脚本放在DOM中的元素后面，否则当你试图获取它们时元素不存在
<html>
<head>
</head>
<body>
<p id="fullname"></p>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
另一个（不那么好）选项是等待onload
window.onload = function() {
var fullname = "example";
document.getElementById('fullname').innerHTML = fullname;
}
或在现代浏览器中
document.addEventListener("DOMContentLoaded", function(event) {
var fullname = "example";
document.getElementById('fullname').innerHTML = fullname;
});
答案 1 :(得分：2)
当脚本执行时，DOM中尚不存在#fullname元素。您需要延迟执行脚本，或重新组织HTML，以便在创建#fullname元素后调用脚本。
[defer] attribute <html>
<head>
<script type="text/javascript" src="script.js" defer></script>
<!-- ^^^^^ -->
</head>
<body>
<p id="fullname"></p>
</body>
</html>
<html>
<head>
</head>
<body>
<p id="fullname"></p>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<p id="fullname"></p>
</body>
</html>
jQuery(function ($) {
var fullname = "example";
$('#fullname').html(fullname);
});
<html>
<head>
<script src="script.js"></script>
</head>
<body>
<p id="fullname"></p>
</body>
</html>
window.addEventListener('load', function () {
var fullname = "example";
document.getElementById('fullname').innerHTML = fullname;
}, false);