Javascript解决浏览器兼容性问题.docVIP

Javascript解决浏览器兼容性问题 2011-04-12 16:51 魔时网 魔时网?字号：T?|?T JavaScript是一种计算机脚本语言，一种新的描述语言，主要在web浏览器（客户端）解释执行，可以嵌入到HTML文件中。本文主要介绍JS在解决浏览器兼容性问题上的几种方法。 AD：2013云计算架构师峰会课程资料下载 1. document.form.item 问题 问题： 代码中存在 document.formName.item(itemName) 这样的语句，不能在FF下运行 解决方法： 改用 document.formName.elements[elementName] 2. 集合类对象问? 问题： 代码中许多集合类对象取用时使用()，IE能接受，FF不能 解决方法： 改用 [] 作为下标运算，例：? document.getElementsByName(inputName)(1)? 改为 document.getElementsByName(inputName)[1] 3. window.event 问题： 使用 window.event 无法在FF上运行 解决方法： FF的 event 只能在事件发生的现场使用，此问题暂无法解决。可以把 event 传到函数里变通解决： onMouseMove?=?functionName(event)? function?functionName?(e)?{ ? e?=?e?||?window.event; ? ? } ? ? ? 4. HTML对象的 id 作为对象名的问题 问题： 在IE中，HTML对象的 ID 可以作为 document 的下属对象变量名直接使用，在FF中不能 解决方法： 使用对象变量时全部用标准的 getElementById(idName) 5. 用 idName 字符串取得对象的问题 问题： 在IE中，利用 eval(idName) 可以取得 id 为 idName 的HTML对象，在FF中不能 解决方法： 用 getElementById(idName) 代替 eval(idName) 6. 变量名与某HTML对象 id 相同的问题 问题： 在FF中，因为对象 id 不作为HTML对象的名称，所以可以使用与HTML对象 id 相同的变量名，IE中不能 解决方法： 在声明变量时，一律加上 var ，以避免歧义，这样在IE中亦可正常运行 最好不要取与HTML对象 id 相同的变量名，以减少错误 7. event.x 与 event.y 问题 问题： 在IE中，event 对象有x,y属性，FF中没有 解决方法： 在FF中，与 event.x 等效的是 event.pageX ，但event.pageX IE中没有 故采用 event.clientX 代替 event.x ，在IE中也有这个变量 event.clientX 与 event.pageX 有微妙的差别，就是滚动条 要完全一样，可以这样： mX = event.x ? event.x : event.pageX; 然后用 mX 代替 event.x 8. 关于frame 问题： 在IE中可以用 window.testFrame 取得该frame，FF中不行 解决方法： window.top.document.getElementById(testFrame).src?=?xx.htm? window.top.frameName.location?=?xx.htm? 9. 取得元素的属性 在FF中，自己定义的属性必须 getAttribute() 取得 10. 在FF中没有 parentElement，parement.children 而用 parentNode，parentNode.childNodes 问题： childNodes 的下标的含义在IE和FF中不同，FF的 childNodes 中会插入空白文本节点 解决方法： 可以通过 node.getElementsByTagName() 来回避这个问题? 问题：? 当html中节点缺失时，IE和FF对 parentNode 的解释不同，例如： form table input/ /table /form? FF中 input.parentNode 的值为form，而IE中 input.parentNode 的值为空节点? 问题：? FF中节点自己没有 removeNode 方法 解决方法： 必须使用如下方法 node.parentNode.removeChild(node) 11. const 问题 问题： 在IE中不能使用 const 关键字 解决方法： 以 var 代替 12. body 对象 FF的 b