前端开发 Js判断页面加载时长加载新页面

前端开发面试基础题|学前端开发需要美术功底吗|前端开发使用软件

为了使网页获得良好的视觉效果，设计师都会把网页做的相对酷一些，一般来说，这样的网站图片的数量会增加很多。相对于视觉效果一般的网页来说，这样的网页肯定更大，加载起来所耗费的时间也会增加。因此，对于一部分网速不高的用户，可能便会在等待加载的过程中因为不耐烦而关闭网页。这无形中就减少了网站的用户数量。一部分内容很长的网页也有类似的问题。

针对这种问题，经过一番思考，我提出了这样的需求：同一内容的页面有两种版本，一种是“炫酷版”，另一种是“瘦身版”。对于网络状况良好的用户，为其展示炫酷版的网页；而对于网络较差的用户，可以为其展示“瘦身版”的网页。

用前端的做法实现，可以这样理解：当网页加载时间超过某个临界值的时候，页面还没有加载完，则停止加载这个网页，并马上跳转到事先做好的“瘦身版”页面。

可以用setTimeou()方法来实现，在页面开始加载的时候，加载一个计时器，并在临界时间之后判断页面的加载状况，于是可以写出这样的代码：

[code]var t1=setTimeout(function(){
if(!(document.readyState==”complete”)){
window.location.href=”https://www.rokub.com”;//测试网址，根据需要自定义添加
}
},4000//时间此处设定为4秒
)[/code]

不过，有些时候，我们并不需要判断整个页面的加载，只需要判断页面之中的某个节点在某个时间段内是否被加载就可以了，而且，这种做法也更灵活一些，因此，我对代码进行了修改：

[code]var t2=setTimeout(
            function(){
                 if(!(document.getElementById("idname"))){
                window.location.href="http://www.baidu.com";
                 }
            }
      ,4000)[/code]

前端页面开发要求|前端开发面试项目展示|前端开发需要哪些知识