纯JavaScript制作动态增加的网页数字

看到别的网页上打开，会显示一个动态的数字，感觉这个效果增加了网页的灵动感。就尝试着写代码，最终实现的方法：

会从0增加到一个数值，实现的代码：

<!-- html 部分   -->
<div class="number">
<div id="num1">0</div>
<div id="num2">0</div>
<div id="num3">0</div>
<div id="num4">0</div>
</div>
<!-- js部分  -->
<script type="text/javascript">
window.onload = function ()
{
    //数字自动获取
    var oNumone = document.getElementById("num1");
    var oNumtwo = document.getElementById("num2");
    var oNumthree = document.getElementById("num3");
    var oNumfour = document.getElementById("num4");
    var i = 0;
    setInterval(updateNum, 10);
    updateNum();
    function updateNum()
    {
        if(oNumone.innerHTML<30)
            oNumone.innerHTML = ++i    
        if(oNumtwo.innerHTML<66)
            oNumtwo.innerHTML = ++i    
        if(oNumthree.innerHTML<88)
            oNumthree.innerHTML = ++i    
        if(oNumfour.innerHTML<666)
            oNumfour.innerHTML = ++i    

    }
}
</script>

 

复制上面的代码，即可实现。
附：JS通过元素的name属性获取元素
使用document对象的getElementsByName（）方法可以通过元素的name属性获取元素，通常用于获取表单元素。与getElementById（）方法不同的是，使用该方法的返回值是一个数组，而不是一个元素，如果想通过name属性获取页面中唯一的元素，可以获取返回数组中下标值为0的元素。
ep：
<input type="text" name="love" id="loveyou" value="sports"/>

<input type="text" name="love" id="loveyou" value="art"/>
获取其value值：
<script language="JavaScript">
alert(document.getElementsByName("love")[0].value);
结果会输出：sports