Question

JavaScript DOM 编码 - ‘未定义’ 错误

2011-08-12

5894

javascript dom dom-events

我遇到了这个错误：

'undefined' is null or not an object'

您能看一下并告诉我吗？在我的编码中，我想要简单的 DOM JavaScript 代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<script>
    init();
    function init()
    {
        getElementByTabIndex("4", "submit")[0].addEventListener("click", Verify, false);
    }
    function Verify() {
        alert('done');  
        // all verification code will be here...
    }
    function getElementByTabIndex(index, type, node)
    {
        if (!node)
        { 
            node = document.getElementsByTagName('body')[0]; 
        } 

        var a = [];
        els = node.getElementsByTagName('*'); 
        for (var i = 0, j = els.length; i < j; i++) 
        { 
            if (els[i].tabIndex == index && els[i].type == type)
            { 
                a.push(els[i]);
            } 
        } 
    return a; 
}

</script>
<body>
<input type="email" id="email" /><input type="password" id="pass" /> <label class="Login" for="login"><input value="Log In" tabindex="4" type="submit" id="login"></label>
</body>
</html>

Answer 1

您必须将代码移至底部或在主体加载后调用 init() 。

原因： 您试图在元素存在之前获取它们。

例如：

<head>
   <script>
      var elm= document.getElementById('id');

      //this will be always undefied, as trying to read element even before they exist
   </script>
</head>

<body>
  <div id='foo'></div>

   <script>
      var elm= document.getElementById('id');

      //this wont be undefined 
   </script>

</body>

Answer 2

您调用：

if (!node) { 
    node = document.getElementsByTagName('body')[0]; 
}

但是您的脚本在 DOM 完成加载之前运行，因此 body 标记不存在。

因此 node 为 undefined ，当您尝试执行以下操作时，会出现错误：

node.getElementsByTagName('*');

在文档加载时运行 init() ，而不是立即运行。

^{PS.

jsfiddle 和 Firebug 允许我非常快速地调试它。}

Answer 3

在您尝试调用 init() 时，javascript 无法使用“body”。

在 dom 加载完成后调用您的 init 方法，如下所示：

window.onload = function (){
    init();
}

请注意，为了使其跨浏览器工作（如果您打算在计划的 Safari 扩展之外使用它），您将必须做一些额外的工作。更多信息： http://www.javascriptkit.com/dhtmltutors/domready.shtml