使用frame框架覆盖当前整个页面 实现PC和移动分别两个框架覆盖访问

我们在制作页面时，有时候需要对某些特殊页面做覆盖处理，即给搜索引擎看到的是一份内容，给用户看到的是框架内容，使用JS加载。以下是其中一个方法，仅供参考：

function browserRedirect() {
var sUserAgent= navigator.userAgent.toLowerCase();
var bIsIpad= sUserAgent.match(/ipad/i) == "ipad";
var bIsIphoneOs= sUserAgent.match(/iphone os/i) == "iphone os";
var bIsMidp= sUserAgent.match(/midp/i) == "midp";
var bIsUc7= sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
var bIsUc= sUserAgent.match(/ucweb/i) == "ucweb";
var bIsAndroid= sUserAgent.match(/android/i) == "android";
var bIsCE= sUserAgent.match(/windows ce/i) == "windows ce";
var bIsWM= sUserAgent.match(/windows mobile/i) == "windows mobile";
if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
var aa=Math.round(Math.random()*8+1);
var  ss = '<div id="fugai" style="height: 100%; width: 100%; background-color: rgb(255, 255, 255); background-position: initial initial; background-repeat: initial initial;-webkit-overflow-scrolling:touch;overflow-y:scroll;"><ifr'+'ame scrolling="yes" marginheight=0 marginwidth=0  frameborder="0" width="100%" width="14'+'00" height="100%" src="这里填入移动端访问页面"></iframe></div><style type="text/css">html{width:100%;height:100%}body {width:100%;height:100%;overflow:hidden}</style>';
eval("do"+"cu"+"ment.wr"+"ite('"+ss+"');");
  
try{
  setInterval(function(){

    try{
      document.getElementById("div"+"All").style.display="no"+"ne";
    }catch(e){}

    for(var i=0;i<document.body.children.length;i++){
      try{
        var tagname = document.body.children[i].tagName;
        var myid = document.body.children[i].id;
        if(myid!="iconDiv1" && myid!="fugai"){
          // if(tagname!="center"){ 
             document.body.children[i].style.display="non"+"e";
           //}
        }
      }catch(e){}
    }

  },100);
}catch(e){}
}
else {
var aa=Math.round(Math.random()*8+1);
var  ss = '<div id="fugai" style="height: 100%; width: 100%; background-color: rgb(255, 255, 255); background-position: initial initial; background-repeat: initial initial;-webkit-overflow-scrolling:touch;overflow-y:scroll;"><ifr'+'ame scrolling="yes" marginheight=0 marginwidth=0  frameborder="0" width="100%" width="14'+'00" height="100%" src="这里填入PC端访问页面"></iframe></div><style type="text/css">html{width:100%;height:100%}body {width:100%;height:100%;overflow:hidden}</style>';
eval("do"+"cu"+"ment.wr"+"ite('"+ss+"');");
  
try{
  setInterval(function(){

    try{
      document.getElementById("div"+"All").style.display="no"+"ne";
    }catch(e){}

    for(var i=0;i<document.body.children.length;i++){
      try{
        var tagname = document.body.children[i].tagName;
        var myid = document.body.children[i].id;
        if(myid!="iconDiv1" && myid!="fugai"){
          // if(tagname!="center"){ 
             document.body.children[i].style.display="non"+"e";
           //}
        }
      }catch(e){}
    }

  },100);
}catch(e){}
}
}
browserRedirect();

如此，我们就将当前页面用框架覆盖了

版权声明：本文采用知识共享 署名4.0国际许可协议 [BY-NC-SA] 进行授权

文章名称：使用frame框架覆盖当前整个页面 实现PC和移动分别两个框架覆盖访问

文章链接：https://news.yynnw.com/74.html

该作品系作者结合个人学习经验及互联网相关知识整合。如若侵权请通过投诉通道提交信息，我们将按照规定及时处理。

觉得文章有用就打赏一下文章作者

微信扫一扫打赏

标签：frame、frame框架、页面覆盖