声明和定义全局变量作为函数结果有时可行吗？
[英]Declaring and Defining Global Variables as Function Result Sometimes Works?
问题描述
Some programming languages I've worked with are fussy about setting global variables to the result of a function, so I'm in the habit of doing it in a main() or an init(). 
我使用过的某些编程语言对于将全局变量设置为函数的结果很挑剔，所以我习惯在main（）或init（）中进行设置。
This was sent to me by a friend and much to my surprise, it works totally fine locally on my computer and on hers, but won't work on either of our servers: 这是由一位朋友发送给我的，这让我很惊讶，它在我的计算机和她的计算机上都可以在本地正常工作，但在我们的任何服务器上都无法使用：
function getValue(val) {
return document.getElementById(val);
}
var myValue = getValue("output"); // is this kosher?
function init() {
myValue.innerHTML = "foo"; //error: myValue is null
//document.getElementById("output").innerHTML="bar"; //this works though
}
window.onload = init
However, oddly enough, this works on the servers as well as locally: 但是，奇怪的是，这在服务器以及本地均适用：
function getValue(val) {
return val;
}
var myValue = getValue("output");
function init() {
alert(myValue);
}
window.onload = init;
I fixed it by doing this: 我通过执行此操作来修复它：
function getValue(val) {
return document.getElementById(val);
}
var myValue; // don't set the value here
function init() {
myValue = getValue("output"); // but here instead
myValue.innerHTML = "foo"; // this is fine
}
window.onload = init
...but now I'm confused as to why the 2nd block of code would work if the 1st one doesn't. ...但是现在我对为什么第二个代码块不能工作的情况感到困惑。 Is it something to do with the JS running through the declarations before the HTML document has time to load when on a server? 这与在HTML文档有时间在服务器上加载之前在声明中运行的JS有关吗？
Just for reference, the document is as such: 仅供参考，文档如下：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<script src="test.js"></script>
</head>
<body>
<div id="output">
</div>
</body>
</html>
2 个解决方案
解决方案1
2 2015-11-11 18:46:52
In the first block you're trying to get an element before the dom(the html itself) fully rendering and initialization. 在第一个块中，您尝试在dom（html本身）完全呈现和初始化之前获取一个元素。 That is why the third block works, because you get it on window.load , the event which runs after the html initialization. 这就是第三个块起作用的原因，因为您在window.load上获得了它，该事件在html初始化之后运行。
The second block works because it is just a string, so its ok. 第二个块有效，因为它只是一个字符串，所以可以。
Here your "output" element doesn't exists yet. 在这里，您的“输出”元素尚不存在。 So myValue will be set to null : 因此， myValue将设置为null ：
var myValue = getValue("output");
That is why it is null inside the window.load . 这就是为什么window.load它为null原因。
解决方案2
1 2015-11-11 18:47:25
In the first block of code, the code is run to grab the doc element immediately. 在第一段代码中，运行该代码以立即获取doc元素。 So the element doesn't exist yet. 因此该元素尚不存在。 Since you grab the element in the init method on the second block, which runs when the DOM is ready, this element now exists. 由于您在DOM准备就绪时运行的第二个块的init方法中获取了该元素，因此该元素现在存在。
If you load the JS script AFTER your HTML (aka, at the very bottom of your tag), your first block would run because the DOM elements exist before the script is run. 如果在HTML之后（也就是标签的最底部）加载JS脚本，则第一个块将运行，因为DOM元素在运行脚本之前就已存在。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.