DOM能力检测兼容

浏览器兼容问题是我们最常见的一个问题，在工作中，我们不仅需要会运用，还需要自己编写出有含金量的兼容代码。

能力检测兼容

解决兼容不同浏览器的代码.在代码中做的判断，叫做能力检测

innerText和textContent都是设置文字内容的,如果设置的内容当中有标签，也会直接的以文本的方式显示(标签的<>都会按照转义的方式进行解析)

innerText是IE支持,textContent是火狐支持

//获取innerText或者是获取textContent
function getInnerTxt(element) {//element表示的标签
return element.innerText?element.innerText:element.textContent;
}
//设置innerText或者是设置textContent
function setInnerText(element,value) {
if(element.innerText){
element.innerText=value;
}else{
element.textContent=value;
}
}

innerText和textContent只是众多兼容代码中的一个，浏览器兼容问题有很多，在写代码的时候一定要在不同的浏览器之间多做测试，将有兼容性问题的代码多做总结。再分享几个：

//获取当前元素前一个元素
function getPreviousElement(element) {
if(element.previousElementSibling){
return element.previousElementSibling;
}else{
var ele=element.previousSibling;
while (ele&&ele.nodeType!==1){
ele=ele.previousSibling;
}
return ele;
}
}
//获取当前元素的后一个元素
function getNextElement(element) {
if(element.nextElementSibling){
return element.nextElementSibling;
}else{
var ele=element.nextSibling;
while(ele&&ele.nodeType!==1){
ele=ele.nextSibling;
}
return ele;
}
}

注意点

textContent谷歌和火狐浏览器都支持，IE8不支持

innerText旧版火狐浏览器不支持

innerHTML可以添加元素（标签）

innerText和textContent都是设置文字内容的，如果设置的内容中间有标签，也会直接的以文本的方式显示（标签的<>都会按照转义的方式进行解析）

innerTe和textCon都可以获取某个标签中的文字内容（不包括标签）

innerHTML可以设置标签中的文字内容和标签

innerHTML获取的是文字和标签

如果想要在标签中知识设置和获取文字内容用innerText或者是textContent

如果想要在标签中设置或获取文字和标签用innerHTML

实际上，用innerHTML也可以只是设置文字和获取文字

以后在不同浏览器间多做测试吧。