JS兼容性汇总

1. Frame
(1)问题：在IE中可以用window.top.frameId和window.top.frameName来得到该Frame所代表的Window，Firefox中只能用window.top.frameName。
(2)解决：将Frame的Id和Name设置成相同，使用window.top.frameName来访问Frame。

2. innerText问题：

(1)现有问题：IE使用innerText，而Firefox使用textContent来设置元素文本内容。
(2)解决方法：如果文本内容不包含"<"和">"等特殊字符，可以使用innerHTML。否则用textContent

3. parentElement，parent.children
(1)现有问题：IE可以使用parentElement获得父结点，parent.children得到结点的所有孩子结点。Firefox不支持。
(2)解决方法：使用parentNode和parent.childNodes。

4.对childNodes的解释。
(1)现有问题：IE和Firefox中对childNodes的解释不同，IE不会包含空白文本结点，而Firefox会包含。
(2)解决方法：使用childNodes过滤文本结点，如下：
      var children = elem.childNodes;
          for (i = 0; i < children.length; i++) {
            if (children[i].nodeType != 3) { // 过滤文本结点
              // ...
            }
          }

5. 对document.getElementById的解释。
(1)现有问题：IE中getElementById不仅检查Id属性，也会检查Name属性，当Name属性匹配参数时也会返回该元素。而在Firefox中只会检查Id属性。
(2)解决方法：尽量保持Id和Name相同，不要让一个元素name属性和另一个元素的id属性相同。

6. 事件差异：IE下是冒泡事件，W3C标准支持冒泡和捕获

(1)绑定事件：

IE attachEvent,detachEvent

Firefox addEventListener,removeEventListener

(2)事件状态：

IE中：事件对象为window.event：$("div").onclick = function() { var oEvent = window.event;}

DOM中：事件对象必须为唯一的事件参数传递给事件处理函数: $("div").onclick = function(){ var oEvent = arguments[0];}或

$("div").onclick = function(oEvent){}

(3)事件源：

IE中：var oTarget = oEvent.srcElement;

DOM中：var oTarget = oEvent.target;

(4)停止事件默认行为：

IE： oEvent.returnValue = false;

DOM：oEvent.preventDefault();

(5)停止事件冒泡或捕获：

if (isIE) {

oEvent.cancelBubble = true;
} else {
oEvent.stopPropagation();
}

巴特西

JS兼容性汇总

最新文章

热门文章