判断不同浏览器,加载不同的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
判断不同浏览器,加载不同的css和js文件的更多相关文章
- 浏览器加载不上css,样式走丢
来自:http://www.cnblogs.com/crizygo/p/5466444.html 问题描述:使用eclipse修改样式文件,浏览器的页面一时显示一时不显示,最后直接没有加载最新的css ...
- 样式的操作-不同浏览器加载不同的css文件
———————————————————— <script type="text/javascript"> //body加载事件监听函数 ...
- 用javascript预加载图片、css、js的方法研究
预加载的好处可以让网页更快的呈现给用户,缺点就是可能会增加无用的请求(但图片.css.js这些静态文件可以被缓存),如果用户访问的页面里面的css.js.图片被预加载了,用户打开页面的速度会快很多,提 ...
- 转载 yii2-按需加载并管理CSS样式/JS脚本
一.资源包定义 Yii2对于CSS/JS 管理,使用AssetBundle资源包类. 创建如下: backend/assets/AppAsset.php namespace backend\asset ...
- Node.js 加载静态资源css,js等不显示问题的解决方法
一,原因 1,没有响应到css等文件 2,响应类型是由文件的后缀名决定 (1)html的请求头 Content-Type : text/html ; charset=utf-8 (2) CSS的请求头 ...
- yii2-按需加载并管理CSS样式/JS脚本
原文地址:https://segmentfault.com/a/1190000003742452
- 使用requireJS加载不符合AMD规范的js文件:shim的使用方式和实现原理
原文链接: http://www.bubuko.com/infodetail-671521.html
- 浏览器加载外部js 的顺序,以及处理顺序。
问题, 有事候按F12打开 google的调试台后,查看network下面加载过来的资源是, 有些资源的状态处于 pending.. 个人理解: 浏览器是可以同时开启多个http 请求去加载外部的资源 ...
- 浏览器加载和渲染html的顺序-css渲染效率的探究
1.浏览器加载和渲染html的顺序1.IE下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的.2.在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相关联的元素都 ...
随机推荐
- ArcGIS Enterprise 10.5.1 静默安装部署记录(Centos 7.2 minimal)- 2、安装WebAdapter
解压webadapter安装包,tar -xzvf Web_Adaptor_Java_Linux_1051_156442.tar.gz 进入下Webadapter目录下静默安装 ./Setup -m ...
- 一点一点学写Makefile(5)-获取文件所在路径
我们在开发一套代码时,应该保证工程放到任何一个目录中均可以编译成功,但是有时候链接库的时候会造成编译错误,本次就会告诉大家如何动态的获得工程所在的绝对路径 代码下载目录 选择Makefile-5 // ...
- oozie coordinator 定时调度
(本段内容摘自http://blog.sina.com.cn/s/blog_e699b42b0102xjqw.html Oozie总结 行成于思的博客) Oozie提出了Coordin ...
- 【转载】#457 Converting Between enums and their Underlying Type
When you declare an enum, by default each enumerated value is represented internally with an int. (S ...
- Git 还没push 前可以做的事(转)
Git 版本控制系統(3) 還沒 push 前可以做的事 转载:http://ihower.tw/blog/archives/2622 這一集要講的是:還沒 push 前可以做的壞事,也就是 re ...
- [转]Ubuntu 配置 Android 开发 环境
转自:http://blog.csdn.net/shulianghan/article/details/20855541 1. 安装 Android Studio (1) 下载Android Stud ...
- 【BZOJ4573】[ZJOI2016] 大森林(LCT)
点此看题面 大致题意: 有\(n\)棵树,初始各有\(1\)个编号为\(1\)的节点,且其为生长节点.\(3\)种操作:将\([l,r]\)区间内的树增加一个新的编号的节点,修改\([l,r]\)区间 ...
- Spring+Velocity+Mybatis入门
转自:https://blog.csdn.net/duqi_2009/article/details/47752169 一.开发工具 开发过程中使用的操作系统是OS X,关于软件安装的问题请大家移步高 ...
- Netbackup客户端安装网络放通端口需求,及测试网络放通方法
192.168.1.101网络放通需求如下: 客户端主机 192.168.1.101 到 服务端主机 192.168.1.100 的1556.13720.13724.1378.13782这5个 ...
- Windows XP和Wndows7误删除了注册表下.exe文件夹之修复办法
在桌面空白处鼠标右击选择“新建-文本文档”,然后将下面的代码复制粘贴进去;如图所示: Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\. ...