首页 > 代码库 > web浏览器兼容简要整理
web浏览器兼容简要整理
ajax的创建
if (window.XMLHttpRequest) {
var xhr = new XMLHttpRequest();
} else { //IE6及其以下版本浏览器
var xhr = new ActiveXObject(‘Microsoft.XMLHTTP‘);
}
事件监听
// target:监听对象
// type:监听函数类型,如click,mouseover
// func:监听函数
function
addEventHandler(target,type,fn){
if
(target.addEventListener){
//IE9,谷歌和火狐
target.addEventListener(type, fn,
false
);
}
else
if
(target.attachEvent){
target.attachEvent(
"on"
+ type, fn);
}
else
{
target[
"on"
+ type] = fn;
}
}
function
removeEventHandler(target, type, fn) { //移除
if
(target.removeEventListener){
//IE9,谷歌和火狐
target.removeEventListener(type, fn,
false
);
}
else
if
(target.detachEvent){
target.detachEvent(
"on"
+ type, fn);
}
else
{
delete
target[
"on"
+ type];
}
e||window.event
//阻止默认事件
function onclick (e){
var e=e||window.event
e.preventDefault();
}
//阻止冒
function stopPropagation(e) {
e = e || window.event;
if(e.stopPropagation) { //W3C阻止冒泡方法
e.stopPropagation();
} else {
e.cancelBubble = true; //IE阻止冒泡方法
}
}
var e = e || window.event;
var target = e.target || e.srcElement;//标准和Ie写法
//事件源:被操作的那个元素
target.nodeName
CSS
我们为了让页面形成统一的效果,要针对不同的浏览器或不同版本写出对应可解析的CSS样式,
我们把这个针对不同浏览器/版本而写CSS的过程叫做 CSS hack.
CSS hack主要有三种:IE条件注释法、CSS属性前缀法、选择器前缀法。
(1)IE条件注释法,即在正常代码之外添加判别IE浏览器或对应版本的条件注释,符合条件的浏览器或者版本号才回执行里边的代码。
<!-- lt是小于 gt是大于 lte是小于等于 gte是不小于 !是不等于 -->
<!-- [if IE]>
你想要执行的代码
<![endif]-->
<!-- [if lt IE 8]>
你想要执行的代码
<![endif]-->
<!-- [if ! IE 8]>
你想要执行的代码
<![endif]-->
(2)CSS属性前缀法,即是给css的属性添加前缀。比如 * 可以被IE6/IE7识别,但 _ 只能被IE6识别,IE6-IE10都可以识别 "\9",IE6不能识别!important FireFox不能识别 * _ \9
(3)选择器前缀法。
IE6 *div{color:red;}
IE7 *+div{color:red;}
CSS reset
浏览器对标签的默认支持不同,所以我们要统一,就要进行CSS reset。
最简单的初始化方法是 *{margin:0; padding:0;} 但不推荐,而且它也并不完善。
web浏览器兼容简要整理
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。