这是HTML结构。。。
<head>
...
<script>
ENV = {...,
current_user: {
id: "314",
display_name: "My name"
}
}
<script/>
...
<head/>
我正在努力阅读"；显示名称"以在应用程序的另一部分中使用。
如果我按F12并在控制台中运行下面的操作，它会返回名称：
console.log(ENV.current_user.display_name)
但下面的内容在上面的同一页面中不起作用：
<script>
const x = ENV.current_user.display_name;
document.getElementById("std").innerHTML = x;
</script>
<h3 id="std"></h3>
我如何打印"；我的名字"在这个h3里面？
您看不到名称，因为脚本需要移动到正文中。
JavaScript正在查找div，但它返回NULL，因为在加载页面之前已经调用了JS。
<body>
<h3 id="std"></h3>
</body>
<script>
ENV = {
current_user: {
id: "314",
display_name: "My name"
}
};
const x = ENV.current_user.display_name;
document.getElementById("std").innerHTML = x;
</script>
您可以在所有页面中导入全局配置文件(config.js(，然后包括其他脚本
<body>
<h3 id="std"></h3>
<script src="config.js" />
<script>
const x = ENV.current_user.display_name;
document.getElementById("std").innerHTML = x;
</script>
</body>
并且您的配置文件将包含ENV变量。
由于页面加载时间的原因，脚本不应该在标头中声明，建议始终将它们放在正文标记的末尾
脚本运行时，您的std元素尚未呈现。这应该有效：
<script>
(function() {
const x = ENV.current_user.display_name;
document.getElementById("std").innerHTML = x;
})();
</script>
把它放在身体里，在身体的末端。
您的
document.getElementById("std").innerHTML = x;
不起作用，因为您的脚本在DOM加载完成之前运行，所以它们将返回null或undefined。你能做的就是把你的放在<body></body>的末尾
以下是整个代码的样子：
<head>
<script>
ENV = {
current_user: {
id: "314",
display_name: "My name"
}
}
</script>
</head>
<body>
<h3 id="std"></h3>
<script>
const x = ENV.current_user.display_name;
document.getElementById("std").innerHTML = x;
</script>
</body>
另一种确保浏览器在加载HTML后运行脚本的方法是将js脚本分离到不同的文件中，并通过将其包含在HTML中
<script defer src='./filename.js'></script>
单词defer告诉浏览器只有在加载HTML时才运行filename.js。