讓FireFox支持innerText的實現(xiàn)代碼

更新時間：2009年12月01日 23:58:51 作者：

DHTML非標準屬性innerText在FireFox中的使用

為firefox實現(xiàn)innerText屬性
很多代碼寫了又忘忘了又寫，很浪費，所以決定養(yǎng)成做筆記的習慣。
知識點：
0、為什么要innerText？因為安全問題
1、為firefox dom模型擴展屬性
2、currentStyle屬性可以取得實際的style狀態(tài)
3、IE實現(xiàn)innerText時考慮了display方式，如果是block則加換行
4、為什么不用textContent？因為textContent沒有考慮元素的display方式，所以不完全與IE兼容

復制代碼代碼如下:

 
<html> 
<body> 
<div id="d1"><a href="aa">ccc</a>ddd<div>eeee</div>fff</div> 
<script type="text/javascript"> 
<!-- 
// 
// patch of innerText for firefox 
// 
(function (bool) { 
function setInnerText(o, s) { 
while (o.childNodes.length != 0) { 
o.removeChild(o.childNodes[0]); 
} 
o.appendChild(document.createTextNode(s)); 
} 
function getInnerText(o) { 
var sRet = ""; 
for (var i = 0; i < o.childNodes.length; i ++) { 
if (o.childNodes[i].childNodes.length != 0) { 
sRet += getInnerText(o.childNodes[i]); 
} 
if (o.childNodes[i].nodeValue) { 
if (o.currentStyle.display == "block") { 
sRet += o.childNodes[i].nodeValue + "\n"; 
} else { 
sRet += o.childNodes[i].nodeValue; 
} 
} 
} 
return sRet; 
} 
if (bool) { 
HTMLElement.prototype.__defineGetter__("currentStyle", function () { 
return this.ownerDocument.defaultView.getComputedStyle(this, null); 
}); 
HTMLElement.prototype.__defineGetter__("innerText", function () { 
return getInnerText(this); 
}) 
HTMLElement.prototype.__defineSetter__("innerText", function(s) { 
setInnerText(this, s); 
}) 
} 
})(/Firefox/.test(window.navigator.userAgent)); 
//--> 
</script> 
<script type="text/javascript"> 
<!-- 
var d1 = document.getElementById("d1"); 
alert(d1.innerText); 
d1.innerText = "xxx"; 
//--> 
</script> 
</body> 
</html> 

今天在制作firefox下支持復制的js代碼的時候，用到了innerText，測試發(fā)現(xiàn)原來firefox支持innerHTML但不支持innerText,所以上網(wǎng)找了一下，發(fā)現(xiàn)了一篇非常不錯的代碼。另從回復中，我們得到了如下兼容代碼。修正了原來ie下出現(xiàn)錯誤提示的問題。具體的看下么的文章。

把這段加在你所JS文件中就可以在MOZILLA/FIREFOX下使用innerText

復制代碼代碼如下:

 
HTMLElement.prototype.__defineGetter__ 
( 
"innerText", 
function () 
{ 
var anyString = ""; 

var childS = this.childNodes; 
for(var i=0; i<childS.length; i++) 
{ 
if(childS[i].nodeType==1) 
anyString += childS[i].tagName=="BR" ? '\n' : childS[i].innerText; 
else if(childS[i].nodeType==3) 
anyString += childS[i].nodeValue; 
} 
return anyString; 
} 
); 

但這段代碼在IE中它會提示HTMLElement未定義，下面就是具體的解決方法。

復制代碼代碼如下:

 
function isIE(){ //ie? 判斷是不是ie 
if (window.navigator.userAgent.indexOf("MSIE")>=1) 
return true; 
else 
return false; 
} 
if(!isIE()){ 
HTMLElement.prototype.__defineGetter__ 
( 
"innerText", 
function () 
{ 
var anyString = ""; 

var childS = this.childNodes; 
for(var i=0; i<childS.length; i++) 
{ 
if(childS[i].nodeType==1) 
anyString += childS[i].tagName=="BR" ? '\n' : childS[i].innerText; 
else if(childS[i].nodeType==3) 
anyString += childS[i].nodeValue; 
} 
return anyString; 
} 
); 
} 