把script放到最后

<script type="text/javascript" defer>程序是顺序执行的。对象没生成当然取不到。

解决方案 »

  1.   

    楼上的不要误人子弟好不好。
    将document.getElementById('num').innerHTML = i + "%";
    改为document.getElementById('num').innerHTML = "<strong id='bar'>"+i+"%"+"</strong>";就好了因为按你的写法就成了
    <strong id="num">
       i%
    </strong>
    自然找不到bar这个对象了。
      

  2.   


    <!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>Untitled Page</title>
        <link rel="Stylesheet" type="text/css" href="test.css" />
        <script type="text/javascript">
            var i = 0;
            function startbar()
            {
                showbar = setInterval("setbar()",100);
            }
            function setbar()
            {
                i += 1;
                if(i >= 100)
                {
                    clearInterval(showbar);
                }
                document.getElementById('bar').style.width = i + "%";
                document.getElementById('num').innerHTML = i + "%";
            }
        </script>
    </head>
    <body>
        <div id="loadbar">
            <strong id="num">
                
            </strong>
            <strong id="bar" style="height:20px;background-color:red;width:0px;position:absolute;"></strong>
        </div>
        <br />
        <a href="javascript:startbar()">开始</a>
    </body>
    </html>
    这样不就可以了吗?
      

  3.   

    同意2楼 innerHTML是指示元素内的HTML代码的 
      

  4.   

    请将strong改成div效果更明显
    document.getElementById('bar').style.width = i + "%";改成:document.getElementById('bar').style.width = (i + "%").toString();
    document.getElementById('num').innerHTML = i + "%";
    改成:document.getElementById('bar').innerHTML = i + "%";如果加入背景色能更加凸显效果,代码改成如下
    <script type="text/javascript">
            var i = 0;
            function startbar()
            {
                showbar = setInterval("setbar()",100);
            }
            function setbar()
            {
                i += 1;
                if(i >= 100)
                {
                    clearInterval(showbar);
                }            document.getElementById('bar').style.width = (i + "%").toString();
    document.getElementById('bar').style.background = '#eee';            
    document.getElementById('bar').innerHTML = i + "%";
            }
        </script>
    </head>
    <body>
        <div id="loadbar">
            <strong id="num">
                <div id="bar"></div>
            </strong>
        </div>
        <a href="javascript:startbar()">begin</a>
    </body>