javascript - 函数作用域和变量进/出所述函数

Question

所以我正在学习并尝试一些东西，好吧，问题是这个

我知道在函数外部定义的变量对所有人都有用，而在函数内部定义的变量则不然。

当我这样做的时候说

HTML:

<input type="text" name="field" id="field"/>

<input type="submit" id="submit" name="submit"/>

JS:

var results = document.getElementById("field").value;
var submitBtn = document.getElementById("submit");

function pushit(){
    aNames.push(results);
    for(i=0; i<aNames.length; i++){
        document.write(aNames[i] + "<br/>");
    }

    submitBtn.onclick = pushit;
}

这是行不通的。当点击提交时，它只显示原始数组项。

但是当我将函数更改为:

function pushit(){
    var results = document.getElementById("field").value;
    aNames.push(results);
    for(i=0; i<aNames.length; i++){
         document.write(aNames[i] + "<br/>");
    }
}

本质上只是将 var 结果放入它工作的函数中。我的 ？是为什么呢？

例如，如果我要说的是，在表单中检查表单中某个字段的特定值，id 以相同的方式检查它的“值”与我想要检查的内容，所以...我只是不明白为什么它不起作用。

任何提示、链接、解释等...我很乐意感谢。

Answer 1

第一个示例中的 results 变量在页面加载时设置，并且永远不会更改。每次读取它时，它都是相同的值。

在第二个示例中，每次运行事件时您都从输入中获取值；你正在制作一个新变量。因此，您将看到新的值。

JavaScript DOM 元素是“实时”变量，但字符串不是。

例如:

var results = document.getElementById("field");
var submitBtn = document.getElementById("submit");

function pushit(){
    alert(results.results);
}

这是因为 results 是一个“实时”变量。当您访问它时，它始终是最新的 DOM 元素。

当您执行 var results = document.getElementById("field").value; 时，现在 results 只是一个字符串；它不再是“现场”了。