产生的原因:
FF实现了DOM1、DOM2
safri实现大部分DOM1、少部分DOM2
IE实现了少部分DOM1、没实现DOM2
获取节点:
childNodes:FF会把空的文本当作一个结点,IE不会。配合使用"nodeType"解决此问题。
获取首(尾)节点:
firstChild(lastChild):IE
firstElementChild(lastElementChild):FF (firstChild在FF中会获取到第一个结点是文本结点)
获取兄弟节点:
节点.nextSibling(previousSibling):IE
节点.nextElementSibling(previousElementSibling):FF
通过className获取元素
getElementsByClassName():IE9以上
通过遍历对比元素的className属性进行筛选:IE8以下(例:if(aEle[i].className == "box"))
获取当前样式(currentStyle):
currentStyle:IE、Opera(例:DIV.currentStyle.widht)注:可能会出现NaN!
getComputedStyle:FireFox、Chrome、Safari(例:window.getComputedStyle(DIV).width)
事件对象(Event):
IE可以直接使用:Event.cancelBubble = true;
FF需要从参数中传进来:oDivShare.onmouseout = function (ev){ ev.cancelBubble = true; }
div.onmouseleave与div.onmouseout事件:
div.onmouseout:会冒泡,从子div移动到父时也会触发,与之对应的鼠标移入事件为:div.onmouseover.
div.onmouseleave:不会冒泡,从子div移动到父div时不会触发,与之对应的鼠标移入事件为:div.onmouseenter.(FF/chrome不兼容,经测试chrome兼容。)
透明度:
opacity:0.5;(CSS的现行标准,IE9、IE10、Firefox,Safari和Opera等。)
filter:alpha(opacity=50);(IE6~IE8)
-moz-opacity:0.5;(老版本的Mozilla。)
-khtml-opacity: 0.5;(老版本的Safari。)
scrollTop、scrollLeft等...:
document.documentElement(IE(声明DTD)、Firefox,例如:var iScrollTop = document.documentElement.scrollTop;)
document.body(Chrome、Edge、IE(未声明DTD,例如:var iScrollTop = document.body.scrollTop);
window.pageYOffset (safari 比较特别,有自己获取scrollTop的函数 )