Question

我很好奇我在这段代码中不理解的内容......

为什么这样做？

 function insert_number(number){
   var output = document.getElementById('output');
   output.value += number.value;
 }

但这不起作用？

var output = document.getElementById('output');

function insert_number(number){
  output.value += number.value;
}

是否与变量output的定义方式有关？

另外，我如何在函数output中编写insert_number()变量，同时仍然使output可用于我的脚本中的所有其他函数（即使它意味着必须将变量转义出来函数，或者特别是将它作为参数发送给另一个函数）？

注意：我的所有代码都在外部“.js”文件中

现在代码的完整上下文就是这个（我稍后会添加更多内容）：

var output = document.getElementById('output');

function insert_number(number){
  output.value += number.value;
}

function clear_output(){
  output.value = "";
}

Answer 1

这是一个只在全局范围内保留单个对象/命名空间的解决方案：

(function(global, d) {
    var output = d.getElementById('output'),
        myApi = {};

    myApi.insert_number = function(number){
      output.value += number.value;
    };

    //export your api to the global scope
    global.myApi = myApi;
})(window, document);

现在您可以调用myApi.insert_number(5);现在您拥有一个可以访问output变量的闭包，这样您就可以向API添加其他功能，而无需每次都访问DOM。

提醒一下，像这样的JavaScript应该放在页面底部正好在结束</body>

之上

我建议您在全球范围内观看此视频：http://www.watchmecode.net/javascript-scope

Answer 2

实际上，只要

中的DOM元素，它们都可以工作

document.getElementById('output')

代码运行时存在

。重要的区别是你的insert_number函数可能在加载DOM之后运行，这与第二个例子中的裸输出分配不同。

另外，我如何在函数中编写output变量 insert_number()同时仍然可以向所有人提供全球输出我的脚本中的其他功能？

优秀的JavaScript开发人员试图避免不必要的全局变量，但简单的答案是：

var output; // declared, but as yet undefined

window.onload = function () {
    window.output = document.getElementById("output");
}

function insert_number(number) {
    output.value += number.value;
}

Answer 3

这与全局变量无关。

您可能在head内有脚本。在那个阶段，DOM尚未完全构建，ID output的元素尚不存在。因此document.getElementById('output')将返回null（example）。

但是如果你可能在构建DOM之后的某个时间调用insert_number，作为对某些用户交互的响应。在这种情况下，元素将存在。

最简单的解决方案是将代码放在结束body标记（example之前，注意不同的jsfiddle设置和/或检查源代码。）

Answer 4

我认为您的代码无效的原因是因为在您致电var output = document.getElementById('output');

时未加载DOM

将代码移到输出div所在的位置，它应该可以正常工作

Answer 5

如果声明变量而不使用“var”，则变量始终变为 global 。更多信息：http://www.w3schools.com/js/js_variables.asp

如何使JavaScript中的所有函数都可以访问变量？

5 个答案: