Javascript常见浏览器兼容问题

标签：

常见浏览器原生javascript兼容性问题主要分为以下几类：

一、Dom

1、获取HTML元素，兼容所有浏览器方法：document.getElementById("id")以Id来获取元素;

    document.getElementsByTagName(“tag”)[0]以标签名来获取元素。另外IE不支持document.getElementsByClassName("class");

2、获取Form表单元素

只兼容IE：document.formname.itemname 

兼容所有：document.forms[“formName”].elements[“itemname”]  或 document.forms[i].elements[“itemname”]

3、设置CSS

只兼容FireFox：obj.setAttribute(style,color:green)

兼容所有：document.getElementById("banana").className 和document.getElementById("banana").style.color

4、获取CSS

获取内嵌样式均可用style来获取，对于获取内部样式和外联样式表中的样式，不同浏览器差异如下

只兼容IE：currentStyle

标准浏览器中：getComputedStyle

5、设置宽高

只兼容IE：obj.style.height = imgObj.height 

兼容所有：obj.style.height = imgObj.height + ‘px‘; 

6、innerText

只兼容IE：obj.innerText= "myText"; 

兼容所有： if (document.all) {   obj.innerText = "myText";  } else {  obj.textContent = "myText";  }  

二、事件

1、事件流，目前事件流主要指捕获-目标-冒泡，二IE6-IE8不支持事件捕获，一般在事件冒泡阶段对事件作出响应。

2、添加事件和删除事件

只兼容IE：obj.achEvent("onclick",handler)  click代表事件,handler代表处理函数。删除事件用detachEvent("click",handler)。

兼容飞IE：obj.addEventListener("click",handler,false) click代表事件，handler代表处理函数，第三个参数表示是否捕获，这里false表示不用在捕获阶段，一般为false。删除事件用removeEventListener("click",handler,false)。

3、事件对象

对于事件对象event，IE下为window.event，兼容所有浏览器写法为event = event || window.event;

获取触发事件的目标节点，IE下为event.srcElement，非IE浏览器为event.target，要获取定义了事件的对象则用event.this。

三、BOM

1、打开窗口

只兼容IE：IE中可以通过showModalDialog和showModelessDialog打开模态和非模态窗口 

兼容所有：直接使用window.open(pageURL,name,parameters)方式打开新窗口。  

2、获取Frame对象

只兼容IE：var frame1 ＝ window.testFrame  

兼容所有：window.top.document.getElementById("frameId")来访问frame标签，并且可以通过window.top.document.getElementById("testFrame").src = ‘xx.htm‘来切换frame的内容，也都可以通过window.top.frameName.location = ‘xx.htm‘来切换frame的内容 。  

目前我所遇到的常用的总结就这么多，后面学习中遇到的我会补充添加进来。

Javascript常见浏览器兼容问题

标签：

原文地址：http://www.cnblogs.com/yxz-turing/p/4814494.html