1.IE8及之前的浏览器不支持通过类找元素;
2.IE8及之前的浏览器不支持非表单元素使用name属性
3.innerText是微软自己弄出来的属性,在以前的标准中不支持,
火狐44版本及其之前都不支持,但是2016年已经加入标准中,所以IE的所有版本都支持;
textContent是IE8以及之前的版本不支持
4. var ul1 = document.getElementById(“ul1”);
ul.children获取的是所有li标签,但是IE8以及之前包括注释节点,
所以最好不要把注释现在里面以免获取到,就不用做兼容
5. var li3 = document.getElementById(“li3”);
console.log(li3.nextElementSibling)//打印的是li4,找的是兄弟元素,也就是兄弟标签,非常好用,但是nextElementSibling IE8及其之前不支持,所以要做兼容
解决兼容如下:
function getNextElement(obj) {
//以后判断支不支持某个属性,就直接if它就行了,if为true就代表支持,为false代表不支持
//能力判断
if (obj.nextElementSibling) {
return obj.nextElementSibling;
} else {
//从节点里面找
var node = obj.nextSibling;
if (node == null) {
return null;
} else {
//只要不是标签都满足循环条件继续找下一个
//只要是标签就不满足循环条件,跳出循环
while (node.nodeType != 1) {
node = node.nextSibling;
if (node == null) {
return null;
}
}
return node;
}
}
}
6.监听网页滚动事件,获取页面的滚动距离
window.onscroll = function(){
console.log(window.pageXOffset,window.pageYOffset)//1659,2789
}//(监听网页滚动事件),获取页面的滚动距离,此方法IE8不兼容
解决兼容如下:
把这个var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
var scrollLeft = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0;放进函数里
封装成函数使用
window.onscroll = function () {
console.log(getScroll().scrollTop)
console.log(getScroll().scrollLeft)
}
function getScroll(){
var obj = {
scrollTop : window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0,
scrollLeft: window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0
};
return obj;
}
7.事件的兼容写法
IE8支持:window.event
box.οnclick= function(){
e = e || window.event
alert(“我被点了”)
}
8.相对于页面左上角的距离pageX,pageY,IE8有兼容问题(web API)
e.pageX = e.clientX + getScroll().scrollLeft;
e.pageY = e.clientY + getScroll().scrollTop;
-
事件对象.charCode,事件对象.keyCode,事件对象.which 都能获取用户按下的键是哪一个(它们各自有各自的兼容性问题) 所以做兼容 var xdx = 事件对象.charCode || 事件对象.keyCode || 事件对象.which