document.getElementbyId() 返回 null [重复]答案

【问题标题】：document.getElementbyId() returning null [duplicate]document.getElementbyId() 返回 null [重复]
【发布时间】：2011-11-01 09:18:38
【问题描述】：

在代码中标记为 //Error in cmets 的行中。我收到 Javascript 错误消息：“无法读取 'null' 的属性样式”。我不知道它找不到对象是什么。我已经想过并尝试了一切。请帮忙。代码如下：

<script type="text/javascript">

    $.getJSON('https://graph.facebook.com/647045111?fields=first_name&<%= Session["Token"] %>',

    function (data) {
        $('#userName').html(data.first_name);
    });

    document.getElementById('connectedUnregistered').style.display = 'block'; //Error

</script>

    <div id="userName"></div>

    <div id="disconnected" style="display:block;">

     <div id="heading">Facebook login</div> 

     <a href="Account/FacebookLogin" id="loginButton"><div id="fbConnectButton"><img src="/Content/Images/fbconnect.png"/></div></a>    

    </div>

     <div id="connectedUnregistered" style="display:none">

     <div id="heading">Register Now</div> 



    </div>

【问题讨论】：

标签： javascript dom

【解决方案1】：

将您的脚本放在 HTML 文档的末尾而不是开头，看看是否能解决问题。

JavaScript 无法编辑 DOM 元素，因为它尚未创建。

【讨论】：

对于可以帮助其冲浪者使用现代浏览器的网站来说，这是可以接受的答案。使用各种浏览器瞄准开放互联网的人们必须使用 $(document).ready malarkey

【解决方案2】：

脚本试图在元素加载之前获取元素。将脚本放在元素之后或将其置于加载或就绪事件中。

【讨论】：

【解决方案3】：

也许尝试将此代码放在一个

$(document).ready(function(){

//Code

});

阻止

【讨论】：

【解决方案4】：

代码在创建元素之前执行。由于您使用的是 jquery，因此只需将其包装在 document.ready 中即可：

$(function(){
    // code goes here
});

这将在 DOM 创建后执行。

【讨论】：

【解决方案5】：

在 DOM 完全可用并且调用失败之前，javascript 代码正在运行。请尝试以下方法

$(document).ready(function() {
  document.getElementById('connectedUnregistered').style.display = 'block'; //Error
}

【讨论】：

【解决方案6】：

在<div id="connectedUnregistered" /> 实际创建之前，您正在执行您的 javascript 代码。

另请注意，您没有关闭您的<div> 并使用相应的</div>。

因此，将您的 javascript 代码移动到 HTML 下方的某个部分。或者在页面加载完成后执行。如果您使用的是 JQuery，您可以这样做：

<script>

    $(document).ready(function() {

        ... your code ...

    });
</script>

【讨论】：

【解决方案7】：

此错误还可能表明该元素没有 ID。

<input type="text" name="myelem" />

确保您的元素具有 ID。

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

【讨论】：

【解决方案8】：

在我的情况下，这是因为在 jsp/html(whatever) 文件的开头有这一行：

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

删除它为我解决了问题（我不记得它最初在我的页面上做了什么）

【讨论】：

【解决方案9】：

此外，如果您在代码的某些部分使用document.write，则得到 null 是很常见的。

【讨论】：