Question

我试过看看stackoverflow，但是找不到与我相同的问题 - 我确定这个问题很容易解决，但不知怎的......它没有用。

我有一些输入，它们将以计算器格式添加/乘/减/除等。我想要的是通过声明我的功能块之外的变量来删除对getElementById的不必要的引用（我不想要任何花哨的多重getElementById赋值）。

我的Javascript如下：

//Declarations: designed to minimze calls to document.getElementByID
    var number1 = document.getElementById("num1");
    var number2 = document.getElementById("num2");
    var numAnswer = document.getElementById("answer");

    //Add together two numbers
    function add()
    {
        numAnswer.value = parseFloat(number1.value) + parseFloat(number2.value);
    }

这让我疯了 - 如果我拿出变量并只使用普通的document.getElementById，一切正常。这应该很容易，但它只是不起作用。我已经检查了拼写，这一切似乎都没问题 - 有什么东西我不见了吗？

Answer 1

如果您在问题中显示的脚本在页面源中的元素后出现，则此方法可以使用。否则浏览器尚未解析这些元素，因此无法通过ID找到它们。

使其工作的另一种方法是在onload或文档就绪处理程序中执行分配，因为在onload或文档就绪时所有无论元素位于页面源中，都可以访问这些元素。

Answer 2

您的代码完全正常，因为您已将其包含在您的问题中。你可以在这里看到：http://jsfiddle.net/jfriend00/kXrDF/。

这意味着您的问题中没有包含其他错误。也许您可以包含更多代码，以便我们可以帮助您找到可能导致代码的其他原因。

要测试“全局”变量的范围，可以在add（）函数中设置断点，并检查number1，number2和numAnswer的值。如果您还没有弄清楚如何设置断点并检查变量，我强烈建议您这样做。如果你仍然不能，那么你可以将临时测试放入你的add（）代码中，以缩小问题的范围：

if (!number1) alert("number1 is not valid");
if (!number2) alert("number2 is not valid");
if (!numAnswer) alert("numAnswer is not valid");

另一种可能性是您的代码在加载页面之前运行得太早，在这种情况下，初始代码无法找到DOM元素，因为它们尚不存在。为防止出现这种问题，您需要确保在加载页面之后代码才会运行。您可以通过将代码放在页面元素之后，或者使用各种技术之一来检测页面何时加载，而不是运行初始化全局变量的代码，直到那时为止。像jQuery和YUI这样的框架都内置了函数，可以帮助你在加载页面后运行代码。

变量赋值给getElementById，不起作用

2 个答案: