为什么我明明写对了.却在firebug里提示错误?

var scrollWrap = $("scrollWrap").scrollLeft;  //用火狐的firebug提示错误了
想做个滚动
<!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>
  <title> New Document </title>
  <style type="text/css">
*{margin:0;padding:0;}
ul{list-style:none}
#scrollWrap{width:906px;height:115px;border:1px solid orange;margin: 65px auto;overflow-x:auto;}
#scrollCon{width:200%;float:left;height:100px;border:1px solid blue;}
#show1 li{width:100px;height:100px;background:red;float:left;margin-right:5px}
#show2 li{width:100px;height:100px;background:green;float:left;margin-right:5px}
#show1,#show2{float:left;}
  </style> <script type="text/javascript">
function $(id){
return document.getElementById(id);
}
var scrollWrap = $("scrollWrap").scrollLeft;
var scrollCon = $("scrollCon").offsetWidth;
function autoScroll(){

if(scrollWrap != scrollCon){
scrollWrap++;
}
else{
scrollWrap=0;
}
//alert("sss")
$("text").innerHTML = scrollWrap+"::"+scrollCon;
setTimeout("autoScroll()",1000)
}
window.onload = autoScroll;

</script> </head> <body>
  
<div id="scrollWrap">
<div id="scrollCon">
<div id="show1">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<div id="show2">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
</div>
<div id="text"></div>
 </body>
</html>

解决方案 »

  1.   

    因为脚本执行的时候dom还没创建。    <script type="text/javascript">
                function $(id){
                    return document.getElementById(id);
                }
                window.onload = function() {
    function autoScroll(){
    if(scrollWrap != scrollCon){
    scrollWrap++;
    }
    else{
    scrollWrap=0;
    }
    document.title = scrollWrap;
    //alert("sss")
    $("text").innerHTML = scrollWrap+"::"+scrollCon;
    setTimeout(function() {
    autoScroll();
    }, 1000);
    }
    var scrollWrap = $("scrollWrap").scrollLeft;
    var scrollCon = $("scrollCon").offsetWidth;
    autoScroll();
                }
        </script>
      

  2.   

    JQuery对象其实是封装数组对象，$("scrollWrap")没有scrollLeft属性
    应该为 $("scrollWrap").scrollLeft()
    或者是$("scrollWrap")[0].scrollLeft其中$("scrollWrap")[0]为dom对象有scrollLeft属性
      

  3.   

    http://jsfiddle.net/YMmjs/
    代码得要放到里面
    $(function()
    {
    //+代码
    });