`

innerText innerHtml textContent兼容问题(

    博客分类:
  • js
 
阅读更多

<!-- 正文开始 -->

IE支持innerHTML与innerText

FireFox支持innerHTML与textContent

所以在IE与FireFox中使用显示内容时,必须得先判断浏览器,然后决定使用innerText还是textContent。

<div id="mydiv"> </div>
<script type="text/javascript">
function isIE()
{
return navigator.userAgent.toLowerCase().indexOf('msie')>0;
}
function isFireFox()
{
return navigator.userAgent.toLowerCase().indexOf('firefox')>0;
}
function showTime()
{
   var mydiv = document.getElementByIdx("mydiv");
   if(isIE())
{
    //mydiv.innerText="<font color='red'>"+new Date()+"</font>";
        mydiv.innerHTML="<font color='red'>"+new Date()+"</font>";
}
   if(isFireFox)
{
//mydiv.textContent="<font color='red'>"+new Date()+"</font>";
        mydiv.innerHTML="<font color='red'>"+new Date()+"</font>";
}
}
window.setTimeout('showTime()',0);
</script>

 

还可以:

if(document.all){
document.getElementByIdx('element').innerText = "my text";
} else{
document.getElementByIdx('element').textContent = "my text";
}

 

还可以:

<mce:script type="text/javascript"><!--
 
var lBrowser = {};
lBrowser.agt = navigator.userAgent.toLowerCase();
lBrowser.isW3C = document.getElementByIdx ? true:false;
lBrowser.isIE = ((lBrowser.agt.indexOf("msie") != -1) && (lBrowser.agt.indexOf("opera") == -1) && (lBrowser.agt.indexOf("omniweb") == -1));
lBrowser.isNS6 = lBrowser.isW3C && (navigator.appName=="Netscape") ;
lBrowser.isOpera = lBrowser.agt.indexOf("opera") != -1;
lBrowser.isGecko = lBrowser.agt.indexOf("gecko") != -1;
lBrowser.ieTrueBody =function (){
  return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
};
//为Firefox下的DOM对象增加innerText属性
if(lBrowser.isNS6){ //firefox innerText define
  HTMLElement.prototype.__defineGetter__( "innerText",
  function(){
  return this.textContent;
  }
  );
  HTMLElement.prototype.__defineSetter__( "innerText",
  function(sText){
  this.textContent=sText;
  }
  );
}
alert(lBrowser.isNS6);
// --></mce:script>

 

分享到:
评论

相关推荐

    js中innerText/textContent和innerHTML与target和currentTarget的区别

    今天小编就为大家分享一篇关于js中innerText/textContent和innerHTML与target和currentTarget的区别,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧

    innerHTML和innerText的区别

    在 JavaScript 中,innerHTML 和 innerText 是两个常用的属性,它们用于获取 HTML 元素中的内容。虽然它们都是用于获取内容的,但它们在获取...因此,在实际开发中,尽量使用 innerHTML 属性,以确保浏览器的兼容性。

    innerHTML属性,outerHTML属性,textContent属性,innerText属性区别详解

    innerHTML属性用来读取或设置某个节点内的HTML代码。 ... textContent属性用来读取或设置节点包含的文本内容...1.innerText受CSS影响,textcontent没有这个问题。比如,如果CSS规则隐藏了某段文本,innerText就不会返回这

    JS获取整个页面文档的实现代码

    唯一需要注意的地方: innerText与textContent,显示页面的时候不能用innerHTML,否则会被解析。innerText与textContent是在除FF之外的浏览器与FF之间的差异。 代码如下: var innerText = document.body.innerText ?...

    JS实现HTML标签转义及反转义

    注:火狐不支持innerText,需要使用 textContent 属性,而IE早期版本不支持此属性,为了同时兼容IE及火狐,需要进行判断操作. 因为innerText(textContent)会获取纯文本内容,忽略html节点标签,而innerHTML会显示...

    textContent在Firefox下与innerText等效的属性

    但在Firefox不支持该属性,好在FF下的DOM对象支持textContent,该属性与innerText等效。 演示实例: ”TestObj”&gt;Hi,I’m &lt;strong&gt;cnlei&lt;/strong&gt;.Welcome to my homepage:&lt;a&gt;http://www.cnlei.com&lt;/a&gt;.&lt;/p&gt; ...

    javascript textContent与innerText的异同分析

    因为发现网络上很少有这方面的内容,因此就把自己私有blog上的这篇文章搬出来到Boluor的公开blog,方便其它人查阅。

    JsDom 编程小结

    1.浏览器兼容问题: 浏览器兼容性的例子:ie6,ie7对table.appendChild(“tr”)的支持和IE8不一样,用insertRow、insertCell来代替或者为表格添加tbody,然后向tbody中添加tr。FF(FireFox)不支持InnerText,用...

    js在IE与firefox的差异集锦

    firefox支持innerHTML但却不支持innerText,它支持textContent来实现innerText,不过默认把多余的空格也保留了。如果不用textContent,如果字符串里面不包含HTML代码也可以用innerHTML代替。 2.禁止选取网页内容: ...

    Box Critters Texture Pack Manager-crx插件

    UPDATE LOG v1.4.2删除了未使用的文件已将多余的innerHTML更改为textContent并将多余的innerText更改为textContent删除了额外的蓝色太空服飞溅允许降价v1.4.1已添加Green Hoodie v1.4.0已添加Racoon Critter固定拼写...

    javascript实现的动态文字变换

    javascript提供了多种方法来实现动态文字变换,包括使用innerHTML、innerText、textContent等属性来改变文字内容,以及使用CSS样式来实现文字的渐隐、渐显、闪烁等效果。 在上述代码中,我们使用了javascript的数组...

    javascript HTMLEncode HTMLDecode的完整实例(兼容ie和火狐)

    方法一: 用的浏览器内部转换器实现转换,方法是动态创建一个容器标签元素,如DIV,将要转换的字符串设置为这个元素的innerText(ie支持)||textContent(火狐支持),然后返回这个元素的innerHTML,即得到经过HTML编码...

    学习笔记:有关网络知识的笔记

    textContent,innerText,outerText,textNode.data工程化JS JS Regenerator运行时同步网络包 webpack打包形成的模块结果分析样式加载器,css加载器,较少加载器,URL加载器样式文件,图片文字文件处理摇树初步组件...

    javascript htmlencode函数(ff兼容版) 主要是编辑器中反转html代码

    方法一: 用的浏览器内部转换器实现转换,要领是动态创建一个容器标签元素,如DIV,将要转换的字符串设置为这个元素的innerText(ie支持)||textContent(火狐支持),然后返回这个元素的innerHTML,即得到经过HTML编码...

    2021前端面试题-持续更新.pdf

    * textContent、innerText、innerHTML、value的区别:这些属性都可以用来获取或设置元素的文本内容,但它们之间有一些差异。 * 关于DOM的API有什么:DOM提供了很多有用的API,例如getElementById、...

    Javascript数组操作高级心得整理

     innerText(IE)、textContent(FF)、innerHTML 26  outerText、outerHTML(少用) 26  value属性获取表单节点内容 26 (3) 访问节点的样式 27  使用节点对象的style属性对象改变样式 27  使用className设置...

Global site tag (gtag.js) - Google Analytics