1.1获取行外样式currentStyle和getComputedStyle
function getStyle(obj, attr) {
if (window.getComputedStyle) {
//chrome
return window.getComputedStyle(obj)[attr];
} else {
//IE
return obj.currentStyle[attr];
}
}
1.2 event事件的兼容问题
document.onclick = function(ev) { //MouseEvent
var ev = ev || window.event;
console.log(ev); //事件对象
};
1.3 阻止冒泡
function stop(ev){
var ev = ev || event;
if (ev.stopPropagation) {
ev.stopPropagation();
} else {
ev.cancelBubble = true;
}
}
1.4 阻止默认行为
if (ev.preventDefault) {
ev.preventDefault(); //标准的
} else {
ev.returnValue = false; //非标准的
}
1.5 获取事件源兼容:
var element=ev.target||ev.srcElement
1.6 事件绑定兼容
if (addEventListener) {
addEventListener();}
else
{ attachEvent();}
1.7 键盘兼容
var code=ev.which||ev.keyCode
1.8 创建ajax对象
var xhr = new XMLHttpRequest() || new ActiveXObject("Microsoft,XMLHTTP")
1 .9 获取浏览器滚动条距离
var scrollTop=document.documentElement.scrollTop||document.body.scrollTop
---------------————
--------------------------------------
关于使用firstChild, lastChild等,获取第一个 / 最后一个元素节点是产生的问题
--IE6 - 8下: firstChild, lastChild, nextSibling, previousSibling, 获取第一个元素节点
(高版本浏览器IE9 +, FF, Chrome不兼容, 其获取的空白文本节点)
--高版本浏览器下: firstElementChild, lastElementChild, nextElementSibling, previousElementSibling
(低版本浏览器IE6 - 8不兼容)
--兼容写法: 找到ul的第一个元素节点, 并将其背景色变成红色
var oUl = document.getElementById('ul');
if (oUl.firstElementChild) {
//高版本浏览器
oUl.firstElementChild.style.background = 'red';
} else {
//IE6-8
oUl.firstChild.style.background = 'red';
}