让FireFox支持innerText的实现代码

为firefox实现innerText属性
很多代码写了又忘忘了又写,很浪费,所以决定养成做笔记的习惯。
知识点:
0、为什么要innerText?因为安全问题
1、为firefox dom模型扩展属性
2、currentStyle属性可以取得实际的style状态
3、IE实现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,测试发现原来firefox支持innerHTML但不支持innerText,所以上网找了一下,发现了一篇非常不错的代码。另从回复中,我们得到了如下兼容代码。修正了原来ie下出现错误提示的问题。具体的看下么的文章。

把这段加在你所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;
}
);
}

您可能感兴趣的文章:

  • 让innerText在firefox火狐和IE浏览器都能用的写法
  • textContent在Firefox下与innerText等效的属性
  • firefox浏览器不支持innerText的解决方法

相关推荐:

Firefox和IE之间7个JavaScript差异分别是什么

Firefox和IE之间7个JavaScript差异分别是什么,很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。尽管JavaScript历史上使用冗长而令人生厌的代码块来标的特定浏览器的时期已经结束了,但是偶尔使用一些简单的...

如何探究IE和Firefox在JavaScript方面的兼容性

这期内容当中小编将会给大家带来有关如何探究IE和Firefox在JavaScript方面的兼容性,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。IE和Firefox在JavaScript方面的兼容性1.document.formName.item("ite...

如何解决JS在firefox和IE下差异问题

这篇文章主要介绍了如何解决JS在firefox和IE下差异问题,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。JS在firefox和IE下差异及解决方案1.document.formName.item(itemName)问题说明:IE下...

chrome、firefox、IE中input输入光标位置错位怎么办

这篇文章主要介绍了chrome、firefox、IE中input输入光标位置错位怎么办,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。 浏览器中input输入光标位置错位详解在工作中遇到的问题,尝试着找找解决方法,还真有呢!记下来方便自...

JS在IE和Firefox兼容性问题及解决方法是怎样的

JS在IE和Firefox兼容性问题及解决方法是怎样的,很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。你对JS在IE和Firefox兼容性问题解决方法是否熟悉,这里和大家分享一下,比如现有代码中存在许多document.f...

Firefox浏览器兼容JS脚本是怎样的

本篇文章为大家展示了Firefox浏览器兼容JS脚本是怎样的,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。向大家描述一下Firefox浏览器兼容JS脚本问题,最近做了一个项目,遇到了FireFox和IE脚本不兼容的问题,为此从网上搜集了部分兼容的脚本,这里和...

CSS如何区分IE6、IE7和Firefox浏览器

今天小编给大家分享一下CSS如何区分IE6、IE7和Firefox浏览器的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。CSS在IE6,IE7,Firefox浏览器中区分的方法◆区别IE...

怎么在Python中控制Firefox方法

本篇文章给大家分享的是有关怎么在Python中控制Firefox方法,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。使用-marionette参数启动Firefox.比较简单的一种做法就是右键单击Firefox的桌面图标,然后选择属性,最...