代码优化

Question

本帖最后由 bing475879749 于 2009-07-30 21:37:24 编辑

Answer 1

写了个 不知道高效不高效 ╮(╯_╰)╭
<script type="text/javascript">
var data = [
['03:30','半夜惊魂'],
['04:30','半夜惊魂'],
['08:30','半夜惊魂'],
['09:30','半夜惊魂'],
['10:30','半夜惊魂'],
['11:30','半夜惊魂'],
['12:30','半夜惊魂'],
['13:30','半夜惊魂'],
['14:30','半夜惊魂'],
['16:30','半夜惊魂'],
['18:30','半夜惊魂'],
['19:30','半夜惊魂'],
['20:30','半夜惊魂'],
['21:30','半夜惊魂'],
['22:30','半夜惊魂'],
['23:30','半夜惊魂']
];
function set(){
var t = new Date();
var h = t.getHours();
var m = t.getMinutes();
h = h>=10 ? h : '0'+h;
m = m>=10 ? m : '0'+m;
var now = h + ':' + m; var i;
for(i=0;i<data.length;i++){
if(data[i][0]>=now){
break;
}
} var li = document.getElementById("box").getElementsByTagName("li");
var begin = (i -1 + data.length - parseInt(li.length/2)) % data.length; //取得列表第一个元素下标

for(i=0;i<li.length;i++,begin++){
li[i].innerHTML = '<span>' + data[begin][1] + '</span>' + data[begin][0];
if(begin == data.length - 1){
begin = -1 ;
}
}
setTimeout(set,2000)
}
setTimeout(set,500);</script>
<div class="box" id="box">
  <ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li class='hover'></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
</div>

Answer 2

一不小心把<script>复制上了 失败 ...

Answer 3

一定要循环LI吗？你直接附ID，那不就是最高效的

Answer 4

用 jQuery:function set(){
    var t = new Date();
    var h = t.getHours();
    var m=t.getMinutes();
    if(m > 30){ //分钟大于 30, 则小时加1
     h++;
    }
    if(h < 10){ //小时小于10小在前面补一个0
     h = "0" + h
    }
    if(m < 10){ //分钟小于10在前面补一个0
     m = "0" + m
    }
    $("#box li").removeClass("hover"); //将所有LI的 hover 样式类去掉
    $("#box li:contains('" + h + ":" + 30 + "')").addClass("hover"); //给对应的LI加上 hover 样式类
}
setInterval(set, 1000); //第隔 1秒（1000毫秒）调用一次 set() 方法

Answer 5

不对吧 我觉得getElementById遍历的还更多些 会去找所有带id的dom比较

Answer 6

0点不好加判断，不然我早判断了JQuery好像比我那还烦琐

Answer 7

         function set(){
             var t=new Date();
             var h=t.getHours();
             var m=t.getMinutes();
             h=h>=10?h:'0'+h;
             m=m>=10?m:'0'+m;
             var box=document.getElementById("box");
             var li=box.getElementsByTagName("li");
             var len=li.length,match;
             for(var i=0;i<len;i++){
                var cur = li[i],ma;
                 cur.className="";
                if((ma = /:(\d{2})/.exec(cur.childNodes[1].nodeValue))){
                   var left =  RegExp.leftContext.replace(/:\s*/g,"");
                    ma = ma[1]=="00"? "60" : ma[1];
                    if(ma=="60"){
                        left = left=="00"?23:left;
                    }
                    if(ma-m>0&&left==h){
                        match = i;
                        cur.className = "hover";
                        break;
                    }
                }
             }
             box.scrollTop = li[0].offsetHeight * (match-5);
             setTimeout(set,2000)
         }        window.onload = function(){
         setTimeout(set,500);
        }

Answer 8

你说的好像有点问题，最快的就是getElementById(),如果想具体优化你就要把你getElementById指定在某一个你想要的范围，换做是期它的

Answer 9

改正一下      function set(){
             var t=new Date();
             var h=t.getHours();
             var m=t.getMinutes();
             h=h>=10?h:'0'+h;
             m=m>=10?m:'0'+m;
             var box=document.getElementById("box");
             var li=box.getElementsByTagName("li");
             var len=li.length,match;
             for(var i=0;i<len;i++){
                var cur = li[i],ma,min;
                cur.className="";
                if((ma = /:(\d{2})/.exec(cur.childNodes[1].nodeValue))){
                   var left =  RegExp.leftContext.replace(/:\s*/g,"");
                    ma = ma[1]=="00"? "60" : ma[1];
                    if(ma=="60"){
                        left = left=="00"?23:left;
                    }
                    if(left==h){
                        if(!min||ma-m<min){
                            min = ma - m;
                            match = i;
                        }
                    }
                }
             }
             li[match].className = "hover";
             box.scrollTop = li[0].offsetHeight * (match-5);
             setTimeout(set,2000)
         }        window.onload = function(){
            setTimeout(set,500);
        }

Answer 10

设计有问题,你的li的id设置成和时间关联的一个串,比如03:30就<li id="03_30">03:30</li>
这样只要判断当前时间在哪个范围内,就直接可以document.getElementById(..)了,不需用循环li

Answer 11

一定要循环LI吗？你直接附ID，那不就是最高效的依楼主的，再次改进一下         function set(){
             var t=new Date();
             var h=t.getHours();
             var m=t.getMinutes();
             h=h>=10?h:'0'+h;
             m=m>=10?m:'0'+m;
             var box=document.getElementById("box");
             var li=box.getElementsByTagName("li");
             var len=li.length,match;
             for(var i=0;i<len;i++){
                var cur = li[i],ma,min;
                cur.className="";
                if((ma = /:(\d{2})/.exec(cur.childNodes[1].nodeValue))){
                   var left =  RegExp.leftContext.replace(/:\s*/g,"");
                    ma = ma[1]=="00"? "60" : ma[1];
                    if(ma=="60"){
                        left = left=="00"?23:left;
                    }
                    if(left - 0 >= h - 0){   
                        if(ma-m<0&&left - 0 > h - 0){
                            match = i;
                            break;
                        }
                        if(!min||ma-m<min){
                            min = ma - m;
                            match = i;
                        }
                    }
                }
             }
             li[match].className = "hover";
             box.scrollTop = li[0].offsetHeight * (match-5);
             setTimeout(set,2000)
         }        window.onload = function(){
          setTimeout(set,500);
        }