判断不同浏览器,加载不同的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.在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相关联的元素都 ...
随机推荐
- Strom入门
Worker.Executor.Task详解: Storm在集群上运行一个Topology时,主要通过以下3个实体来完成Topology的执行工作:1. Worker Process(工作进程)——S ...
- 64位MATLAB和C混合编程以及联合调试
[环境说明] 电脑操作系统:win 7 旗舰版,64位 MATLAB版本:R2013b VS版本:Microsoft Visual Studio 2010 [操作说明] 1.在原来工程的基础上添加下列 ...
- HTTP协议安全头部X-Content-Type-Options引入的问题
前段时间测试MM反馈了一个问题,在富文本编辑器里上传的图片无法正常呈现.因为Jackie在本机的环境上没有观察类似的现象,而恰好那天测试环境的某个重要配项被改错了,于是Jackie想当然的归类为配置项 ...
- 使用slmgr查看、删除windows 授权(key)
查看 slmgr.vbs /dlv 删除授权 使用管理员权限进入cmd All program -> accessories -> Command Prompt (右键 已管理员方式运行) ...
- POJ-3267 The Cow Lexicon---删除字符匹配单词
题目链接: https://cn.vjudge.net/problem/POJ-3267 题目大意: 题意就是给出一个主串,和一本字典,问最少在主串删除多少字母,可以使其匹配到字典的单词序列. PS: ...
- Uva 11396 爪分解
题目链接:https://vjudge.net/contest/166461#problem/A 题意: 给定一个图,特点是每个点的度都是3,求是不是原图可以分解为全部鸡爪:每条边只属于一个鸡爪: 分 ...
- 【转】Android Fragment 真正的完全解析(上)
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/37970961 自从Fragment出现,曾经有段时间,感觉大家谈什么都能跟Fra ...
- 【转】Android总结之drawable(hdpi,mdpi,ldpi)文件夹的使用
做Android有段时间了,但是好多细节还没有深入理解,关于Android中drawable文件夹的使用理解的就不是很深入. Android为开发者提供了两种解决适配问题的方法,第一种方式是使用dip ...
- [18/11/11] java标识符及变量
一.标识符规范 1.必须以字母.下划线 .美元符号开头. 即数字不能作为开头,其它位随便 2.不可以是java关键字(即保留字), 如static .class.new 等 . 注:int 年 ...
- 43. Multiply Strings 字符串相乘
1. 原始题目 给定两个以字符串形式表示的非负整数 num1 和 num2,返回 num1 和 num2 的乘积,它们的乘积也表示为字符串形式. 示例 1: 输入: num1 = "2&qu ...