html loading 页面加载中（百分比）

版权声明：本文为博主原创文章，需要转载尽管转载。 https://blog.csdn.net/z5976749/article/details/85299473

$(function(){})是dom加载完毕后执行，window.onload是所有资源（图片和js外部资源）加载完毕后执行。

 var Inter1 = null;
 //二选一
 $(function () {
      //DOM加载完毕后执行
      Inter1 = setInterval('addBar()', 100);
 })

 document.addEventListener('DOMContentLoaded', function (event) {
      //DOM加载完毕后执行
      Inter1 = setInterval('addBar()', 100);
 });

    //二选一
    window.onload = function () {
        //外部资源加载完毕后执行
        finishBar();
    }

    window.addEventListener('load', function (event) {
        //外部资源加载完毕后执行
        finishBar();
    });

//启动定时器
    function addBar() {
        if (widthNow == 99) {
            return false;
        }
        widthNow++;
        $('#txtBar').text(widthNow + "%");
        $('#loadingBar').width(widthNow + '%');
    }
//取消定时器
    function finishBar() {
        clearInterval(Inter1);
        $('#txtBar').text("100%");
        $('#loadingBar').width('100%');
    }