Question

当我使用这样的代码时，它可以正常工作：

function removeWarning() {
    var systemStatus = document.getElementById("system-status");
    systemStatus.innerHTML = "";
}

function indicateInvalidUsername() {
    var systemStatus = document.getElementById("system-status");
    systemStatus.innerHTML = "Invalid username";
}

然而，当我想将systemStatus移动为全局变量时，它不起作用：

var systemStatus = document.getElementById("system-status");

function removeWarning() {
    systemStatus.innerHTML = "";
}

function indicateInvalidUsername() {
    systemStatus.innerHTML = "Invalid username";
}

我应该在这做什么？

Answer 1

这实际上取决于JavaScript代码的位置。

问题可能是由于行

时没有加载DOM引起的

var systemStatus = document.getElementById("system-status");

已执行。您可以尝试在onload事件中调用它，或者理想地使用来自JavaScript框架的DOM ready类型事件。

Answer 2

确保在任何代码块之外的“root”级别声明变量。

您也可以完全删除var，虽然这是not recommended并且会发出“严格”警告。

根据documentation at MDC，您可以使用window.variablename设置全局变量。

Answer 3

我的猜测是在运行变量声明后声明了system-status元素。因此，在声明变量时，它实际上被设置为null？

您应该只声明它，然后从onLoad处理程序中分配它的值，因为这样您就可以确定它已正确初始化（加载）了相关元素。

您也可以尝试将脚本放在页面底部（或者至少在声明system-status元素后的某个位置），但不能保证始终有效。

Answer 4

在外部作用域中声明systemStatus并在onload处理程序中指定它。

systemStatus = null;

function onloadHandler(evt) {
    systemStatus = document.getElementById("....");
}

或者，如果您不想使用onload处理程序，请将脚本标记放在HTML的底部。

Answer 5

This article就是解决这些问题的答案！ ;）仔细阅读！

Answer 6

全局变量最好用外部JavaScript文件表示：

var system_status;

确保在其他任何地方都没有使用过它。然后，要访问页面上的变量，只需引用它。比如说，你想在文本框中填写结果，

document.getElementById("textbox1").value = system_status;

要确保对象存在，请使用jQuery的文档就绪功能。

示例：

$(function() {
    $("#textbox1")[0].value = system_status;
});

Answer 7

要定义基于DOM元素的全局变量，必须检查一些事项。首先，如果代码在<head>部分中，那么DOM将不会在执行时加载。在这种情况下，必须放置一个事件处理程序，以便在加载DOM之后设置变量，如下所示：

var systemStatus;
window.onload = function(){ systemStatus = document.getElementById("system_status"); };

但是，如果此脚本在DOM加载时在页面中内联，则只要有问题的DOM元素已加载到脚本所在的位置上方，就可以完成此操作。这是因为javascript同步执行。这是有效的：

<div id="system_status"></div>
<script type="text/javascript">
 var systemStatus = document.getElementById("system_status");
</script>

作为后一个示例的结果，大多数在正文中运行脚本的页面将它们保存到文档的最后。这将允许页面加载，然后执行javascript，这在大多数情况下会导致更快地呈现DOM。

初始化外部函数时无法访问变量

7 个答案: