浏览器界中，有五大巨头，分别是谷歌，火狐，苹果，Opera和IE，其中火狐有自己的部分属性，IE不同的版本也有各自的一些属性，要想在这些浏览器中正确是显示网页，就要为这些属性写上它们的兼容代码,一般只要适配了谷歌，火狐和IE这三种浏览器，其他浏览器基本都支持。
技巧：不管是哪一款浏览器，如果浏览器不支持该属性的话，其类型都是“undefined”，根据这个类型既可写出其兼容代码，以下内容是需要对浏览器进行兼容的地方。
- 设置标签的文本内容，即闭合标签中间的内容，如p标签，div标签，span标签... textContext属性：谷歌,火狐支持,IE8不支持 innerText属性：谷歌,火狐,IE8都支持 innerHTML属性：浏览器都支持，推荐使用
其兼容代码
function setInnerText(element,text) { //判断浏览器是否支持这个属性 if(typeof element.textContent =="undefined"){//如果浏览器不支持该属性 element.innerText=text; }else{//支持这个属性 element.textContent=text; } } //获取任意标签中间的文本内容 function getInnerText(element) { if(typeof element.textContent=="undefined"){ return element.innerText; }else{ return element.textContent; } }复制代码 - 获取节点或元素的兼容代码： 在谷歌和火狐浏览器中，都支持获取节点和元素的方法，但是在IE8浏览器中，对于获取具体的节点或或元素，则IE8会不支持和得到的结果不同。在IE8中，对于获取具体节点的方法，返回的是元素，而获取具体元素的方法，则不支持。
获取相关节点和元素的方法，一共有12种
获取父亲节点：对象.parentNode 获取父亲元素：对象.parentElement 获取子节点：对象.childNodes （返回伪数组） 获取子元素：对象.children （返回伪数组） 获取第一个节点：对象.firstChild 获取第一个子元素：对象.firstElementChild 获取最后一个子节点：.lastChild 获取最后一个子元素：对象.lastElementChild 获取前一个兄弟节点：对象.previousSibling 获取前一个兄弟元素：对象.previousElementSibling 获取后一个兄弟节点：对象.nextSibling 获取后一个兄弟元素：对象.nextElementSibling
总结：在谷歌和火狐浏览器中,1~12种方法都支持，获取节点的方法获取到的是节点，获取元素的方法获取到的是元素； 在IE8浏览器中，从5开始，获取节点的方法获取到的是元素，获取元素的方法获取到的是undefind，不支持获取元素的方法
说到底，我们获取节点的目的主要还是获取元素节点，因此，其兼容性代码获取任意一个父级元素的第一个子级元素
//因为firstChild毕竟是获取节点的方法，所以加上循环确保此节点是元素节点，严谨写法function getFirstChildElement(fElement){ if(fElement.firstElementChild){ return fElement.firstElementChild; }else{ var node = fElement.firstChild; while(node && node.nodeType != 1){ node = node.nextSibling; } return node; }}复制代码 获取任意一个父级元素的最后一个子级元素
function getLastElementChild(element) { if(element.lastElementChild){//true--->支持 return element.lastElementChild; }else{ var node=element.lastChild;//第一个节点 while (node&&node.nodeType!=1){ node=node.previousSibling; } return node; } }复制代码 获取任意元素的点一个元素
获取任意元素的后一个元素 其代码可参考以上- 为任意元素.绑定任意的事件, 任意的元素,事件的类型,事件处理函数 谷歌和火狐浏览器支持addEventListener(type,fn,false)，不支持attachEvent("on"+type,fn)，而IE相反。
function addEventListener(element,type,fn) { //判断浏览器是否支持这个方法 if(element.addEventListener){ element.addEventListener(type,fn,false); }else if(element.attachEvent){ element.attachEvent("on"+type,fn); }else{ element["on"+type]=fn; } }复制代码 注意：对象.addEventListener(type,fn,false)和对象.attachEvent("on"+type,fn)这两个方法可对同个点击事件进行绑定，而不会覆盖掉前面的监听方法，假如对按钮的点击事件进行了3次监听，调用这种方法的话，3次监听都能够执行，而不会覆盖掉。 对象.addEventListener(type,fn,useCapture)：这是谷歌和火狐的兼容多监听方法
type:String 事件类型，前面不能加“on”，如点击事件：“click” fn：Function 匿名函数或命名函数 useCapture： 一般为false 对象.attachEvent(type,fn)：这是谷歌的兼容多监听方法 type：String 事件类型，前面要加“on”，如点击事件：“onclick”