Javascript和CSS浏览器兼容总结.docVIP

这是我总结多年的一个小文档，主要内容是Javascript和CSS浏览器兼容总结，最近看见有人咨询浏览器兼容的问题，就贡献出来。上面定义的Price在函数并不一定全，有的也可能不准确，比如新出的IE8、Chrome等都没有太多涉及，虽然最近做的一些项目也兼容了IE8、Chrome等，但都没来的及总结进去，后来就忘了…汗。大家一起慢慢完善吧。javascript部分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.x8. 关于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 的解释不同，例如：formtableinput//table/formFF中 input.parentNode 的值为form，而IE中 input.parentNode 的值为空节点问题：FF中节点自己没有 removeNode 方法解决方法：必须使用如下方法 node.parentNode.removeChild(node)11. const 问题问题：在IE中不能使用 const 关键字解决方