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 相关文章推荐
nicejforms——美化表单不用愁
Feb 20 Javascript
javascript实现轮显新闻标题链接
Aug 13 Javascript
JavaScript 学习笔记(九)call和apply方法
Jan 11 Javascript
window.dialogArguments 使用说明
Apr 11 Javascript
jquery高级编程的最佳实践详解
Mar 23 Javascript
jquery实现定时自动轮播特效
Dec 10 Javascript
vue2.0实现分页组件的实例代码
Jun 22 Javascript
基于wordpress的ajax写法详解
Jan 02 Javascript
Express下采用bcryptjs进行密码加密的方法
Feb 07 Javascript
详解Vue2.0配置mint-ui踩过的那些坑
Apr 23 Javascript
JavaScript+H5实现微信摇一摇功能
May 23 Javascript
js判断一个对象是数组(函数)的方法实例
Dec 19 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
学习php设计模式 php实现工厂模式(factory)
2015/12/07 PHP
PHP+Ajax验证码验证用户登录
2016/07/20 PHP
PHP实现获取第一个中文首字母并进行排序的方法
2017/05/09 PHP
PHP编程中的Session阻塞问题与解决方法分析
2017/08/07 PHP
PHP的mysqli_ssl_set()函数讲解
2019/01/23 PHP
得到jQuery detach()后节点中的某个值实现代码
2013/02/05 Javascript
关于在IE下的一个安全BUG --可用于跟踪用户的系统鼠标位置
2013/04/17 Javascript
基于Unit PNG Fix.js有时候在ie6下不正常的解决办法
2013/06/26 Javascript
js仿手机页面文件下拉刷新效果
2016/10/14 Javascript
在Vue中使用echarts的实例代码(3种图)
2017/07/10 Javascript
使用SVG基本操作API的实例讲解
2017/09/14 Javascript
seajs中模块依赖的加载处理实例分析
2017/10/10 Javascript
javascript代码优化的8点总结
2018/01/29 Javascript
微信小程序之圆形进度条实现思路
2018/02/22 Javascript
纯javascript前端实现base64图片下载(兼容IE10+)
2018/09/14 Javascript
JavaScript获取某一天所在的星期
2019/09/05 Javascript
layui use 定义js外部引用函数的方法
2019/09/26 Javascript
Javascript中的this,bind和that使用实例
2019/12/05 Javascript
js实现限定范围拖拽的示例
2020/10/26 Javascript
用python实现的去除win下文本文件头部BOM的代码
2013/02/10 Python
跟老齐学Python之字典,你还记得吗?
2014/09/20 Python
跟老齐学Python之编写类之二方法
2014/10/11 Python
Python文件和目录操作详解
2015/02/08 Python
详解python调用cmd命令三种方法
2019/07/08 Python
Python实现数值积分方式
2019/11/20 Python
python re.match()用法相关示例
2021/01/27 Python
CSS3实现内凹圆角的实例代码
2017/05/04 HTML / CSS
鱼油专家:Omegavia
2016/10/10 全球购物
美国最好的保健品打折网店:Swanson
2017/08/04 全球购物
最新的小工具和卓越的产品设计:Oh That Tech!
2019/08/07 全球购物
网络编程中设计并发服务器,使用多进程与多线程,请问有什么区别?
2016/03/27 面试题
会议邀请书范文
2014/02/02 职场文书
民事答辩状范本
2015/05/21 职场文书
2016新教师岗前培训心得体会
2016/01/08 职场文书
JavaScript 去重和重复次数统计
2021/03/31 Javascript
详解TS数字分隔符和更严格的类属性检查
2021/05/06 Javascript