zoukankan      html  css  js  c++  java
  • 判断不同浏览器,加载不同的css和js文件

    在低版本的IE中,条件注释还有效果,但是在ie9,10,11浏览器中,条件注释不起作用。

    在网上找了个校验ie的方法。

    function isIE(){
      if (window.ActiveXObject || "ActiveXObject" in window){
        alert('is ie')
      }else{
        alert(not ie')
      }
    }
    isIE();


    IE下才有这个对象ActiveXObject

    当然我们也可以根据浏览器是否为IE,引入不同的js和css文件。

    这里网上有个例子。

    var linkNode = document.createElement("link"),scriptNode = document.createElement("script");  
    linkNode.setAttribute("rel","stylesheet");  
    linkNode.setAttribute("type","text/css");  
    scriptNode.setAttribute("type", "text/javascript");  

    if(getBrowser()=="IE"){  
        linkNode.setAttribute("href","css/index-ie.css");  
        scriptNode.setAttribute("src", "js/index-ie.js");  
    }else if(getBrowser()=="Firefox"){  
        linkNode.setAttribute("href","css/index-firefox.css");  
        scriptNode.setAttribute("src", "js/index-firefox.js");  
    }else if(getBrowser()=="Opera"){  
        linkNode.setAttribute("href","css/index-opera.css");  
        scriptNode.setAttribute("src", "js/index-opera.js");  
    }else if(getBrowser()=="Chrome"){  
        linkNode.setAttribute("href","css/index-chrome.css");  
        scriptNode.setAttribute("src", "js/index-chrome.js");  
    }else if(getBrowser()=="Safari"){  
        linkNode.setAttribute("href","css/index-safari.css");  
        scriptNode.setAttribute("src", "js/index-safari.js");  
    }  
    document.head.appendChild(linkNode);  
    document.head.appendChild(scriptNode);

    即先生成link和script标签,给类型,再根据浏览器的不同给出不同的路径
    是ie就引入polyfill.js和browser.js,并且vue的script标签类型为text/babel,非IE浏览器下,不需要引入polyfill.js和browser.js,vue的script标签类型为text/javascript,即最传统的类型。

    function isIE(src){
      var polyfill = document.createElement("script");
      var browser = document.createElement("script");
      var myVuejs = document.createElement("script");
      polyfill.setAttribute("src", "../../js/bootshop/js/polyfill.js");
      browser.setAttribute("src", "../../js/bootshop/js/browser.min.js");
      myVuejs.setAttribute("src", src);

      if (window.ActiveXObject || "ActiveXObject" in window){
        myVuejs.setAttribute("type", "text/babel");
        document.head.appendChild(polyfill);
        document.head.appendChild(browser);
        document.head.appendChild(myVuejs);
      }else{
        document.head.appendChild(myVuejs);
      }
    }

    原文:https://blog.csdn.net/cofecode/article/details/80175179

  • 相关阅读:
    JS定时器做物体运动
    JS做动态表格
    JS如何做2048(详细)
    改变 C/C++ 控制台程序的输出颜色和样式
    The Game Of Life – 数据结构与算法的敲门砖
    适用于 macOS 下 2K 显示器开启 HiDPI 的简便解决方案
    「踩坑记」Android API 判断权限申请结果的闪退问题
    Hello World!
    js 放大镜效果
    js 随机验证码生成及校验
  • 原文地址:https://www.cnblogs.com/alexguoyihao/p/10195436.html
Copyright © 2011-2022 走看看