JS兼容
1、选择器中的兼容问题
1) 在低版本的浏览器中,getElementsByName 和getElementsByClassName有兼容性
原因:并不是所有的标签都有name值
2)ES5选择器:document.querySelectorAll();支持IE8+
2、节点的兼容问题
获取第一个非空白的子节点:firstElementChild (IE7、8不支持)
获取最后一个非空白的子节点:lastElementChild(IE7、8不支持)
获取下一个兄弟节点(包含空白节点和注释):nextSibling (IE7、8包括注释节点,不包含空白节点)
获取下个兄弟节点:nextSibling(IE7、8不支持)
获取上一个兄弟节点(包含空白节点和注释):previousSibling(IE7、8包括注释节点,不包含空白节点)
获取上个兄弟节点:previousElementSibling(IE7、8不支持)
3、获取非行内样式的兼容:
function getStyle(obj,style){
if(obj.currentStyle){
return obj.currentStyle[style]; //IE的
}else{
return getComputedStyle(obj,false)[style]; // 非IE
}
}
4、事件的兼容:
document.onclick = function (eve) {
var e = eve || window.event;
// 非IE || IE
console.log(e);
}
5、事件源的兼容:
var target = e.target || e.srcElement;
6、键盘按下事件的兼容:
var keyC = eve.keyCode || eve.which
7、阻止事件冒泡的兼容:
eve.stopPropagation();
eve.cancelBubble = true; //兼容IE
8、浏览器的页面卷动值的兼容:
document.documentElement.scrollHeight || document.body.scrollTop;
9、 阻止浏览器的默认事件的兼容:
if( e.preventDefault ){
e.preventDefault();
}else{
window.event.returnValue = false;
}
10、事件监听的兼容:(DOM2级)
非IE:(事件名不带on),第三个参数表示是在捕获阶段还是冒泡阶段
Div.addEventListener('click',fn,false);
oDiv.removeEventListener('click',fn ,false);
IE:只有冒泡阶段,所以没有第三个参数(事件名需要加on)
oDiv.attachEvent();
oDiv.detachEvent() ;
推荐阅读
-
经常遇到的浏览器兼容性问题_html/css_WEB-ITnose
-
javascript - 为什么 php页面 这个链接会返回一个js代码呢?
-
JS实现短信验证码
-
js固定DIV高度,超出部分自动添加滚动条的简单方法_javascript技巧
-
用PHP代替JS玩转DOM的思路及示例代码_PHP
-
js打开windows上的可执行文件示例_javascript技巧
-
Js中setTimeout()和setInterval() 何时被调用执行的用法_基础知识
-
推荐分享Node.js中18个值得了解的Web框架和工具
-
高亮闪烁某个元素的js脚本_javascript技巧
-
js实现鼠标感应向下滑动隐藏菜单的方法_javascript技巧