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 相关文章推荐
帮助避免错误的Javascript陷阱清单
May 31 Javascript
jQuery Dialog 弹出层对话框插件
Aug 09 Javascript
JQuery中$.ajax()方法参数详解及应用
Dec 12 Javascript
Egret引擎开发指南之运行项目
Sep 03 Javascript
js生成随机数的方法实例
Oct 16 Javascript
使用jQuery的easydrag插件实现可拖动的DIV弹出框
Feb 19 Javascript
分享bootstrap学习笔记心得(组件及其属性)
Jan 11 Javascript
简单实现JavaScript弹幕效果
Aug 27 Javascript
bootstrap+jquery项目引入文件报错的解决方法
Jan 22 jQuery
详解SPA中前端路由基本原理与实现方式
Sep 12 Javascript
使用jQuery动态设置单选框的选中效果
Dec 06 jQuery
使用Vue-scroller页面input框不能触发滑动的问题及解决方法
Aug 08 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 第二节 数据类型之数组
2012/04/28 PHP
PHP APC配置文件2套和参数详解
2014/06/11 PHP
php使用curl通过代理获取数据的实现方法
2016/05/16 PHP
PHP中的print_r 与 var_dump 输出数组
2016/06/13 PHP
js删除所有的cookie的代码
2010/11/25 Javascript
基于jquery的3d效果实现代码
2011/03/23 Javascript
js 获取时间间隔实现代码
2014/05/12 Javascript
深入浅出分析javaScript中this用法
2015/05/09 Javascript
使用CamanJS在Web页面上处理图像的技巧
2015/08/18 Javascript
JS实现可拖曳、可关闭的弹窗效果
2015/09/26 Javascript
理解javascript正则表达式
2016/03/08 Javascript
js 性能优化之快速响应的用户界面
2017/02/15 Javascript
JavaScript数组去重的多种方法(四种)
2017/09/19 Javascript
基于Vue的侧边目录组件的实现
2020/02/05 Javascript
[01:01:29]2018DOTA2亚洲邀请赛 4.4 淘汰赛 VP vs Liquid 第一场
2018/04/05 DOTA
Sanic框架蓝图用法实例分析
2018/07/17 Python
详解Python_shutil模块
2019/03/15 Python
python实现微信每日一句自动发送给喜欢的人
2019/04/29 Python
python制作图片缩略图
2019/04/30 Python
python中的句柄操作的方法示例
2019/06/20 Python
python 反编译exe文件为py文件的实例代码
2019/06/27 Python
Python PyQt5 Pycharm 环境搭建及配置详解(图文教程)
2019/07/16 Python
Python递归函数 二分查找算法实现解析
2019/08/12 Python
OpenCV+face++实现实时人脸识别解锁功能
2019/08/28 Python
PyTorch和Keras计算模型参数的例子
2020/01/02 Python
python中setuptools的作用是什么
2020/06/19 Python
python实现批处理文件
2020/07/28 Python
HTML5新增的8类INPUT输入类型介绍
2015/07/06 HTML / CSS
制衣厂各岗位职责
2013/12/02 职场文书
高三毕业寄语
2014/04/10 职场文书
2014年城管工作总结
2014/11/20 职场文书
迎新晚会主持词开场白
2015/05/28 职场文书
2015年教师个人业务工作总结
2015/10/23 职场文书
导游词之峨眉山
2019/12/16 职场文书
python中requests库+xpath+lxml简单使用
2021/04/29 Python
JavaScript异步操作中串行和并行
2021/11/20 Javascript