javascript - 发生了什么？有一天还可以，第二天就是 'undefined' ？

Question

我正在编写一个greatmonkey脚本。最近我遇到了两次同样的问题，我不知道为什么会发生这种情况。

function colli(){
.....
var oPriorityMass = bynID('massadderPriority');//my own document.getElementById() function
var aPriorities = [];
if (oPriorityMass) {
    for (var cEntry=0; cEntry < oPriorityMass.childNodes.length; cEntry++) {
        var sCollNumber = oPriorityMass.childNodes[cEntry].getAttribute('coll');
        if (bynID('adder' + sCollNumber + '_check').checked)
            aPriorities.push(parseInt(sCollNumber));
    }
}
.....
}

所以这其中的奥秘是，有一天我将 oPriorityMass 命名为 oPririoty。它工作正常，但整个功能尚未完成，我开始为我的脚本开发另一个功能。这些功能彼此没有联系。

几天后，我决定回到上面示例中的函数并完成它。我在没有修改任何内容的情况下对其进行了测试，并在 Firefox 的 (4) javascript 错误控制台中收到错误，指出 oPriority.chilNodes[cEntry] 未定义。注意，几天前我已经以完全相同的方式测试了它，根本没有这样的问题。

好的，所以，我决定将 oPriority 重命名为 oPriorityMass。神奇的是，问题解决了。

起初我想，也许两个对象存在一些冲突，在不同的函数中使用相同的名称，它们以某种方式继续存在，甚至超出了函数范围。我的脚本目前超过 6000 行，但我进行了搜索，发现除了在这个函数中之外，其他任何地方都没有提到 oPriority。

有人可以告诉我，这是如何以及为什么会发生吗？我提到同样的事情现在发生了两次，它们发生在不同的函数中，但同样的问题 node.childNodes[c] is undefined 但 node 不为 null 并且 node .childNodes.length 显示正确的子节点数。到底是怎么回事？如何避免此类问题？

谢谢

编辑:错误控制台给出的错误是错误:未捕获的异常:TypeError:oPriorityMass.childNodes[cEntry] 未定义

回应布洛克的评论:GM_log(oPriorityMass.childNodes[cEntry]) 返回 undefined 作为消息。所以 node.childNodes[c] 通常是未定义的。

我的脚本创建一个 div 窗口。后来，上面的函数使用了这个div中的元素。元素确实有唯一的 ID，我 100% 确定原始站点不知道它们。我的脚本有一个开始/停止按钮，可以在需要时运行一个或另一个功能。我现在一直在刷新页面并运行我的脚本函数。我注意到有时(但并非总是)脚本会在第一次运行时失败并出现所描述的错误，但是，如果我再次运行它(不刷新页面)，它就会开始工作。

该页面有一个可以修改它的 JavaScript。它改变了一些元素的宽度，因此当浏览器调整大小时它也会改变。但我知道它对我的 div 没有影响，因为当我调整浏览器大小时它保持不变。

编辑2:

function bynID(sID) {
    return top.document.getElementById(ns(sID));
}
function ns(sText) {
    return g_sScriptName + '_' + sText;
}

ns 函数只是在 ID 前面添加脚本名称。我在创建 HTML 元素时使用它，因此我的元素永远不会与网页具有相同的 id。所以 bynID() 是一个简单的函数，当我需要通过 ID 获取元素时，它可以节省一些打字时间。

我已经修改了我的 colli() 函数以包含检查

if (oPriorityMass) {
    if (!oPriorityMass.childNodes[0]) {
        GM_log('Retrying');
        setTimeout(loadPage,2000);
        return;
    }
    for (var cEntry=0; cEntry < oPriorityMass.childNodes.length; cEntry++) {
        var sCollNumber = oPriorityMass.childNodes[cEntry].getAttribute('coll');
        if (bynID('adder' + sCollNumber + '_check').checked)
            aPriorities.push(parseInt(sCollNumber));
    }
}

loadPage 函数执行 1 个 AJAX 调用，然后我对其运行了一些 XPATH 查询，但实际内容从未附加/显示在页面上，只是保留在 document.createElement( 'div')，然后该函数调用 colli()。现在，当我修改了我的函数时，我检查了错误控制台，发现可能需要最多 5 次尝试才能开始正常工作。 5 x 2 秒，即 10 秒。永远不会重试 5 次，可能会有所不同。一定还有其他事情发生？

Answer 1

在 Firefox 中，childNode 可以包含 #text 节点。在尝试调用之前，您应该检查以确保 childNodes[cEntry] 具有 nodeType == 1 或具有 getAttribute 方法。例如

<div id="d0">
</div>
<div id="d1"></div>

在上面的 Firefox 和类似浏览器(即基于 Gecko 和 WebKit 的浏览器，如 Safari)中，d0 有一个子节点，一个文本节点，而 d1 没有子节点。

所以我会做这样的事情:

var sCollNumber, el0, el1;

if (oPriorityMass) {
    for (var cEntry=0; cEntry < oPriorityMass.childNodes.length; cEntry++) {
        el0 = oPriorityMass.childNodes[cEntry];

        // Make sure have an HTMLElement that will
        // have a getAttribute method
        if (el0.nodeType == 1) {
          sCollNumber = el0.getAttribute('coll');
          el1 = bynID('adder' + sCollNumber + '_check');

         // Make sure el1 is not falsey before attempting to
         // access properties
         if (el1 && el1.checked)

            // Never call parseInt on strings without a radix
            // Or use some other method to convert to Number
            aPriorities.push(parseInt(sCollNumber, 10));
    }
}

鉴于 sCollNumber 看起来像是一个字符串整数(只是猜测，但看起来很可能)，您还可以使用:

Number(sCollNumber)

或

+sCollNumber

无论哪个适合并且更易于维护。