innertext , insertadjacentelement , insertadjacenthtml , insertadjacenttext 等区别


Posted in Javascript onJune 29, 2007

innerText 属性在 IE 浏览器中可以得到当前元素过滤掉 HTML Tags 之后的文本内容,在某些时候还是比较有用。但类似的非标准属性/方法在其他浏览器中并不一定都得到支持。
类似的像 insertAdjacentElement , insertAdjacentElement , insertAdjacentHTML , insertAdjacentText 等。如果需要使用这些非标准的方法,或者已有的代码大量使用了这些方法的话,就必须为其他浏览器提供对应的 prototype 定义。比如:

var isMinNS5 = (navigator.appName.indexOf("Netscape") >= 0 &&
               parseFloat(navigator.appVersion) >= 5) ? 1 : 0;

if (isMinNS5){
 HTMLElement.prototype.insertAdjacentElement = function(where,parsedNode){
   switch (where){
   case ’beforeBegin’:
     this.parentNode.insertBefore(parsedNode,this)
     break;
   case ’afterBegin’:
     this.insertBefore(parsedNode,this.firstChild);
     break;
   case ’beforeEnd’:
     this.appendChild(parsedNode);
     break;
   case ’afterEnd’:
     if(this.nextSibling){
       this.parentNode.insertBefore(parsedNode,this.nextSibling);
     }
     else{
       this.parentNode.appendChild(parsedNode)
     }
   break;
   }
 }
 HTMLElement.prototype.insertAdjacentHTML = function(where,htmlStr){
   var r = this.ownerDocument.createRange();
   r.setStartBefore(this);
   var parsedHTML = r.createContextualFragment(htmlStr);
   this.appendChild(parsedHTML)
 }
 HTMLElement.prototype.insertAdjacentText = function(where,txtStr){
   var parsedText = document.createTextNode(txtStr)
   this.insertAdjacentElement(where,parsedText)
 }
 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;
   }
 );
}

Javascript 相关文章推荐
关于jquery.validate1.9.0前台验证的使用介绍
Apr 26 Javascript
JS小功能(checkbox实现全选和全取消)实例代码
Nov 28 Javascript
JavaScript实现两个Table固定表头根据页面大小自行调整
Jan 03 Javascript
js限制checkbox选中个数以限制六个为例
Jul 15 Javascript
js+html5绘制图片到canvas的方法
Jun 05 Javascript
jQuery实现查找最近父节点的方法
Jun 23 Javascript
js无法获取到html标签的属性的解决方法
Jul 26 Javascript
JS实现上传图片实时预览功能
May 22 Javascript
vue 简单自动补全的输入框的示例
Mar 12 Javascript
JavaScript常用数组操作方法,包含ES6方法
May 10 Javascript
详解jQuery中的prop()使用方法
Jan 05 jQuery
解决vue 退出动画无效的问题
Aug 09 Javascript
javascript之函数直接量(function(){})()
Jun 29 #Javascript
javascript延时重复执行函数 lLoopRun.js
Jun 29 #Javascript
JavaScript 编程引入命名空间的方法
Jun 29 #Javascript
你需要知道的JavsScript可以做什么?
Jun 29 #Javascript
ECMAScript 基础知识
Jun 29 #Javascript
javascript中的几个运算符
Jun 29 #Javascript
一个加载js文件的小脚本
Jun 28 #Javascript
You might like
编译问题
2006/10/09 PHP
PHP的Yii框架中移除组件所绑定的行为的方法
2016/03/18 PHP
浅谈php中的循环while、do...while、for、foreach四种循环
2016/11/05 PHP
PHP递归实现快速排序的方法示例
2017/12/18 PHP
php+laravel依赖注入知识点总结
2019/11/04 PHP
PHP项目多语言配置平台实现过程解析
2020/05/18 PHP
比较详细的关于javascript中void(0)的具体含义解释
2007/08/02 Javascript
国外的为初学者写的JavaScript教程
2008/06/09 Javascript
jquery 卷帘效果实现代码(不同方向)
2013/02/05 Javascript
JavaScript中使用数组方法汇总
2016/02/16 Javascript
深入浅析Bootstrap列表组组件
2016/05/03 Javascript
nodejs简单实现操作arduino
2016/09/25 NodeJs
js+html5生成自动排列对话框实例
2017/10/09 Javascript
layer弹出子iframe层父子页面传值的实现方法
2018/11/22 Javascript
JavaScript使用闭包模仿块级作用域操作示例
2019/01/21 Javascript
JavaScript遍历DOM元素的常见方式示例
2019/02/16 Javascript
如何在微信小程序里面退出小程序的方法
2019/04/28 Javascript
vue实现点击按钮切换背景颜色的示例代码
2020/06/23 Javascript
js基于canvas实现时钟组件
2021/02/07 Javascript
详细解读tornado协程(coroutine)原理
2018/01/15 Python
Python2中文处理纪要的实现方法
2018/03/10 Python
Ubuntu下使用python读取doc和docx文档的内容方法
2018/05/08 Python
详解python数据结构和算法
2019/04/18 Python
Django框架实现分页显示内容的方法详解
2019/05/10 Python
关于阿里云oss获取sts凭证 app直传 python的实例
2019/08/20 Python
利用pandas将非数值数据转换成数值的方式
2019/12/18 Python
Python多线程多进程实例对比解析
2020/03/12 Python
Boda Skins皮衣官网:奢侈皮夹克,全球配送
2016/12/15 全球购物
长曲棍球装备:Lacrosse Monkey
2020/12/02 全球购物
教育科学研究生自荐信
2013/10/09 职场文书
工作中个人的自我评价
2013/12/31 职场文书
农业局学习党的群众路线教育实践活动心得体会
2014/03/07 职场文书
2016年第十九届推普周活动总结
2016/04/06 职场文书
手残删除python之后的补救方法
2021/06/26 Python
深入理解Pytorch微调torchvision模型
2021/11/11 Python
在CSS中使用when/else的方法
2022/01/18 HTML / CSS