2012-08-10 68 views
0

获取类型错误:document.getElementById("free_shipping")null什么是错的JS代码,让我知道,如果代码可以提高

这是我尝试---

我只是想确保这些两个特别的div只显示我的主页。但即时通讯这个错误,但警报正在工作。让我知道如果我失去了一些东西。

我可以使这个代码更好,因为在这种情况下我只需要使用JAVACRIPT

JS代码

<script type="text/javascript"> 
var myaddr = location.host; 
if(myaddr == "abc.xy.com") 
{ 
document.getElementById('free_shipping').style.display="visible"; 
document.getElementById('sale').style.display="visible"; 
//alert("I am in if"); 
} 
else{ 
document.getElementById('free_shipping').style.display="none"; 
document.getElementById('sale').style.display="none"; 
//alert("I am in else"); 
} 
</script> 

HTML代码

<!--####### Free Shipping Start ##############--> 
    <div id="free_shipping"> 
    </div> 
    <!--Free Shipping End--> 
    <!--####### Sale Start ####### --> 
    <div id="sale"> 
    </div> 
    <!--Sale End--> 

CSS代码

#free_shipping 
    { 
    background: url("../images/template/swap_free_shipping.jpg") no-repeat scroll 0 0 transparent; 
    height: 112px; 
    left: -57px; 
    position: relative; 
    top: 256px; 
    width: 62px; 
    } 
    #sale 
    { 
    background: url("../images/template/swap_sale.jpg") no-repeat scroll 0 0 transparent; 
    left: -55px; 
    position: relative; 
    top: 384px; 
    width: 59px; 
    height: 79px; 

} 

回答

1

如果您<script>是在你的网站的<head></head>部分,然后将开始执行该页面加载之前,因此free_shippingsale不会在DOM存在。

尝试做以下,这将使你的代码发生一次页面加载完成后...

<script type="text/javascript"> 
    window.onload = function() { 
    var myaddr = location.host; 
    if(myaddr == "abc.xy.com") 
    { 
     document.getElementById('free_shipping').style.display="visible"; 
     document.getElementById('sale').style.display="visible"; 
     //alert("I am in if"); 
    } 
    else{ 
     document.getElementById('free_shipping').style.display="none"; 
     document.getElementById('sale').style.display="none"; 
     //alert("I am in else"); 
    } 
} 
</script> 

这也可以使用jquery library完成,但我对它的了解是非常有限的。

+0

THX兄弟......这是问题..固定 – swapnesh 2012-08-10 11:37:40

+1

不客气@swapnesh,祝你的项目其他部分顺利:-) – freefaller 2012-08-10 11:38:59

1

也许JS是为在文档已完全加载之前调用,因此该元素尚不存在? 尝试使用页面底部的JS代码或仅在完整页面加载后调用它。

1

我觉得你的情况脚本执行被称为早于实际ELEM创建

<body> 
<!--####### Free Shipping Start ##############--> 
<div id="free_shipping"> 
</div> 
<!--Free Shipping End--> 
<!--####### Sale Start ####### --> 
<div id="sale"> 
</div> 
<!--Sale End--> 
</body> 

<script type="text/javascript"> 
var myaddr = location.host; 
if(myaddr == "abc.xy.com") 
{ 
document.getElementById('free_shipping').style.display="visible"; 
document.getElementById('sale').style.display="visible"; 
//alert("I am in if"); 
} 
else{ 
document.getElementById('free_shipping').style.display="none"; 
document.getElementById('sale').style.display="none"; 
//alert("I am in else"); 
} 
</script> 

应该解决您的问题,还要检查这个 - javascript:how to write $(document).ready like event without jquery