<1>使用事件对象event时:
IE9+.Chrome:event是一个内置全局对象,也可以通过事件函数第一个参数传入
IE9-:event时内置全局变量,不能当作参数传入
Firefox(标准下):event对象只能通过事件函数的第一个参数传入的
兼容性处理方式:obj.οnclick=function(ev){
ev = ev||event; }
<2>Chrome不识别document.documentElement(文档节点树的根节点)
兼容性处理方法:var=scrollTop=document.body.scrollTop||document.documentElement.scrollTop
<3>AJAX
IE:new ActiveXObject()
FF、Chrome:new XMLHttpRequest()
兼容性处理方法: 统一封装创建XMLHttpRequest对象的方法
<4>集合类对象的()与[]的问题
IE下,可以使用()或[]获取集合类对象;Firefox下,只能使用[]获取集合类对象。
Js代码 :
document.write(document.forms("formName").src);
//该写法在IE下能访问到Form对象的src属性
兼容性处理方法:将document.forms("formName")改为 document.forms["formName"]。统一使用[]获取集合 类对象。
<5>.innerText的使用
FF不支持innerText,它支持textContent来实现innerText,不过textContent没有像innerText一样考虑元素的 display方式,所以不完全与IE兼容。如果不用textContent,字符串里面不包含HTML代码也可以用innerHTML代 替。
兼容性处理方法:通过判断不同浏览器做不同的处理
<6>自定义属性问题
说明:IE下,可以使用获取常规属性的方法来获取自定义属性,也可以使用getAttribute()获取自定义属性,Firefox 下,只能使用getAttribute()获取自定义属性。
兼容性处理方法:统一通过getAttribute()获取自定义属性,不过更推荐直接通过“点”运算符访问元素属性。
<7>const问题
说明:Firefox下,可以使用const关键字或var关键字来定义常量,IE下,只能使用var关键字来定义常量。
兼容性处理方法:统一使用var关键字来定义常量。
<8>.event.x与event.y问题
说明:IE下,even对象有x,y属性,但是没有pageX,pageY属性;Firefox下,even对象有pageX,pageY属性,但是没有x,y属性。
兼容性处理方法:使用var x = e.x ? e.x : e.pageX; 来代替IE下的event.x或者Firefox下的e.pageX
<9>.innerText问题
说明:innerText在IE中能正常工作,但是innerText在FireFox中却不行. 需用textContent。
兼容性处理方法:elem.innerText = elem.textContent = “值”
<10>通过类名获取元素
兼容性处理方法:封装函数 function getByClassName(){}
<11>鼠标滚轮滚动事件
兼容性处理方法:封装函数
<12>DOM节点相关的问题:
兼容性处理方法:封装函数
<13>获取元素的非行间样式值:
兼容性处理方法:封装函数
<14>设置监听事件:
兼容性处理方法:封装函数
<15>元素到浏览器边缘的距离(实用):
兼容性处理方法:封装函数
<16>阻止事件传播:
兼容性处理方法:封装函数
<17>阻止默认事件:
兼容性处理方法:封装函数
<18>关于EVENT事件中的target:
兼容性处理方法:封装函数
<19>节点加载:
兼容性处理方法:封装函数
<20>常遇到的关于浏览器的宽高问题(看解决代码)