2

我的头部有以下脚本：

 1| <script type="text/javascript">
 2| var inAccount = 0;
 3| if (inAccount = 0){
 4|   document.getElementById("L-out").style.display = 'block';
 5|   document.getElementById("User").style.display = 'block';
 6| }else{
 7|   document.getElementById("User").style.display = 'none';
 8|   document.getElementById("L-out").style.display = 'none';
 9| }
10| </script>

我的正文部分中的以下代码：

<div id="log">
<a href="#" class="in" id="Sign-up">Sign up</a>
<a href="#" class="in" id="L-in">Login</a>
<a href="#" class="in" id="User">Account</a>
<a href="#" class="in" id="L-out">Logout</a>
</div>

当我加载页面时，我收到此错误消息：'null' is not an object。参考第 7 行。

有谁知道会发生什么？

4

5 回答 5

3

当脚本运行时，脚本中引用的 DOM 元素还不存在（这就是引用为空的原因）。要解决，只需将该脚本移动到window.load/domready事件处理程序上（或简单地将该脚本作为元素的最后一个子body元素）

作为旁注，应使用相等性检查===

于 2013-06-13T12:58:01.117 回答
0
  1. ==在 javascript 中比较变量时使用

  2. 在您的页面中导入 jQuery 以使您的 js 跨浏览器

    $(document).ready(function(){
    var inAccount = 0;
    if (inAccount == 0){
        $("#User").show();
        $("#L-out").show();
    }else{
        $("#Sign-up").show();
        $("#L-in").show();
    }
});

这是小提琴：http: //jsfiddle.net/5wER6/

于 2013-06-13T13:07:24.210 回答
0

确保<script>标签位于文档底部 [就在</body>] 上方（有几个原因）：

  1. 使页面呈现为第一优先级（站点对最终用户来说更快）。
  2. DOM 对象将在此时创建，因此 JS 将能够定位元素（就像您很可能遇到问题一样）。

您可以在顶部绑定到准备好的文档，但我仍然坚信 HTML 第一，JS 第二。

此外，在 JavaScript 中进行比较时，请使用==（或用于特定类型的比较===）。您在第一if(...)条语句中使用了赋值。

于 2013-06-13T12:59:09.823 回答
0

发生的事情是您的代码正在寻找尚未实际加载的元素！你可以做些什么来解决这个问题，将你当前的 if-else 语句包装到一个新函数中（function init() {...}例如），然后在你的 body 标签中：

<body onload="init();">

此外，请注意在您的 if 语句中使用==或。===

于 2013-06-13T12:59:54.907 回答
0

Dom 还没有准备好。包装你的代码

window.onload = function(){ 
 if (inAccount == 0){
     document.getElementById("L-out").style.display = 'block';
     document.getElementById("User").style.display = 'block';
  }else{
     document.getElementById("User").style.display = 'none';
    document.getElementById("L-out").style.display = 'none';
   }
});
于 2013-06-13T12:58:36.253 回答