用一个例子来认识innerText,innerHTML

作者:yang 来源:Yang'blog 时间:2007-12-24 17:17:00 

运行下面的代码你就可以清楚的认识到这两个参数的用法,innerText只能动态的改变指定元素内的文本内容,而innerHTML则不仅仅可以改变文本还可以添加新的对象元素。下面的例子中只有用innerHTML添加的新的元素<p>被样式表识别了,而innerText添加的只被解析为文本。


但是需要注意的是:FF不支持innerText方法了,不过也可以通过脚本让IE和FF都支持innerText方法,下面是脚本代码,把下面的脚本加入到网页内就可以实现FF也可以使用innerText方法


<script language="javascript">
function isIE(){ //ie? 
   if (window.navigator.userAgent.toLowerCase().indexOf("msie")>=1) 
    return true; 
   else 
    return false; 

if(!isIE()){ //firefox innerText define
   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;
    } 
   ); 
   HTMLElement.prototype.__defineSetter__(     "innerText", 
    function(sText){ 
     this.textContent=sText; 
    } 
   ); 
}
</script>


标签:innerText,innerHTML,js
0
投稿

猜你喜欢

  • Python 识别录音并转为文字的实现

    2021-12-05 02:40:28
  • python实现集中式的病毒扫描功能详解

    2022-03-04 03:16:00
  • MySQL 4.0 升级到mysql 5.0的方法

    2024-01-18 10:07:12
  • PHPStudy hosts文件可能不存在或被阻止打开及同步hosts失败问题

    2023-06-08 10:29:10
  • Golang中struct{}和struct{}{}的区别解析

    2024-04-23 09:36:21
  • python实现发送邮件

    2021-08-06 04:33:28
  • 利用Python实现好看的水波特效

    2023-05-26 22:23:53
  • Pytorch实现LSTM和GRU示例

    2022-02-08 09:14:44
  • Vue实现简单跑马灯特效

    2024-04-30 10:31:05
  • Windows 配置Apache以便在浏览器中运行Python script的CGI模式

    2021-08-01 11:22:07
  • 详解Mysql如何实现数据同步到Elasticsearch

    2024-01-23 04:39:57
  • PyTorch中的参数类torch.nn.Parameter()详解

    2021-09-07 19:06:30
  • 形成视觉冲击的几种方式

    2008-08-03 15:57:00
  • Javascript获取background属性中url的值

    2024-04-10 13:59:10
  • 用PHP编写和读取XML的几种方式

    2023-11-18 22:30:27
  • Python多线程爬虫实战_爬取糗事百科段子的实例

    2021-02-15 16:58:21
  • python对于requests的封装方法详解

    2023-02-06 15:29:48
  • python3 实现mysql数据库连接池的示例代码

    2024-01-17 15:25:59
  • python3 googletrans超时报错问题及翻译工具优化方案 附源码

    2022-07-15 12:05:47
  • Hadoop-3.1.2完全分布式环境搭建过程图文详解(Windows 10)

    2023-08-06 07:04:50
  • asp之家 网络编程 m.aspxhome.com