怎么改变HTML代码的样式呢？


<ol>
<li style="display: none;">1111</li>
<li style="display: none;">2222</li>
<li style="display: none;">3333</li>
</ol>想用js循环控制li里面的样式。
如第一个改成
style="display: list-item;"
到第二个改成
style="display: list-item;"
第一个还原默认样式

解决方案 »

  1.   

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="gb2312" />
    <title></title>
    </head>
    <body>
    <ol>
    <li style="display: none;">1111</li>
    <li style="display: none;">2222</li>
    <li style="display: none;">3333</li>
    </ol>
    <script>
    var $ = function(id){
    return document.getElementById(id);
    };
    var $t = function(tag, cot){
    cot = cot || document;
    return cot.getElementsByTagName(tag);
    };

    var lis = $t('li');
    for( var i = 0, len = lis.length; i < len; i++ ){
    lis[i].style.display = 'list-item';
    }


    </script>
    </body>
    </html>这个 意思？
      

  2.   

    我想每次只显示一个<li>这样我刚才调试没有执行出来
      

  3.   


    <!DOCTYPE HTML>
    <html>
        <head>
            <meta charset="gb2312" />
            <title></title>
        </head>
        <body>
            <ol>
                <li style="display: none;">1111</li>
                <li style="display: none;">2222</li>
                <li style="display: none;">3333</li>
            </ol>        
            <script>
                var $ = function(id){
                    return document.getElementById(id);
                };
                var $t = function(tag, cot){
                    cot = cot || document;
                    return cot.getElementsByTagName(tag);
                };
                
                var lis = $t('li');
    var  len = lis.length;
    var c = 0;
    setInterval(function(){
    for( var i = 0; i < len; i++ ){
    lis[i].style.display = 'none';
    }
    lis[c].style.display = 'list-item';
    if( c == len - 1 ){
    c = 0;
    }else{
    c++;
    }
    }, 1000)
                
            </script>
        </body>
    </html>