javascript生成/解析dom的CDATA类型的字段的代码


Posted in Javascript onApril 22, 2007

两段demo代码如下(for ie only):
<script type="text/javascript">  
//demo1
var  xmlDoc  =  new  ActiveXObject("Msxml2.DOMDocument");  
var  root;  
var  CDATASection;  
xmlDoc.async  =  false;  
xmlDoc.loadXML("<a/>");  
root  =  xmlDoc.documentElement;  
CDATASection  =  xmlDoc.createCDATASection("Hello  World!");  
root.appendChild(CDATASection);  
b=xmlDoc.createElement("Test")  
b.text="hahahahaha"  
root.appendChild(b);  
alert(root.xml);    
for(i  =0;i<root.childNodes.length;i++)  
{  
if(root.childNodes[i].nodeType==4)  
alert(root.childNodes[i].nodeValue)  
}  
</script>

<script type="text/javascript">  
//demo2
var  xmlDoc  =  new  ActiveXObject("Msxml2.DOMDocument");   
xmlDoc.async  =  false;  
xmlDoc.loadXML("<a><![CDATA[aaaaaaaaaaaaaaaaaaaaa]]></a>");  
root  =  xmlDoc.documentElement;   
for(i  =0;i<root.childNodes.length;i++)  
{  
if(root.childNodes[i].nodeType==4)  
alert(root.childNodes[i].nodeValue)  
}  
</script> 
//demo3( for firefox)
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > 
< HTML > 
< HEAD > 
< TITLE >  使firefox对xml的处理兼容IE的selectSingleNode selectNodes方法  </ TITLE > 
< META  NAME ="Author"  CONTENT ="emu" > 
< META  NAME ="Keywords"  CONTENT ="firefox IE selectSingleNode selectNodes" > 
< META  NAME ="Description"  CONTENT ="使firefox可以支持selectSingleNode selectNodes方法" > 
< SCRIPT  LANGUAGE ="JavaScript" > 
<!-- 
var  isIE  =   !! document.all;

function  parseXML(st){
     if (isIE){
         var  result  =   new  ActiveXObject( " microsoft.XMLDOM " );
        result.loadXML(st);
    } else {
         var  parser  =   new  DOMParser();
         var  result  =  parser.parseFromString(st,  " text/xml " );
    }
     return  result;
}

if ( ! isIE){
     var  ex;
    XMLDocument.prototype.__proto__.__defineGetter__( " xml " ,  function (){
         try {
             return   new  XMLSerializer().serializeToString( this );
        } catch (ex){
             var  d  =  document.createElement( " div " );
            d.appendChild( this .cloneNode( true ));
             return  d.innerHTML;
        }
    });
    Element.prototype.__proto__.__defineGetter__( " xml " ,  function (){
         try {
             return   new  XMLSerializer().serializeToString( this );
        } catch (ex){
             var  d  =  document.createElement( " div " );
            d.appendChild( this .cloneNode( true ));
             return  d.innerHTML;
        }
    });
    XMLDocument.prototype.__proto__.__defineGetter__( " text " ,  function (){
         return   this .firstChild.textContent
    });
    Element.prototype.__proto__.__defineGetter__( " text " ,  function (){
         return   this .textContent
    });

    XMLDocument.prototype.selectSingleNode = Element.prototype.selectSingleNode = function (xpath){
         var  x = this .selectNodes(xpath)
         if ( ! x  ||  x.length < 1 ) return   null ;
         return  x[ 0 ];
    }
    XMLDocument.prototype.selectNodes = Element.prototype.selectNodes = function (xpath){
         var  xpe  =   new  XPathEvaluator();
         var  nsResolver  =  xpe.createNSResolver( this .ownerDocument  ==   null   ? 
             this .documentElement :  this .ownerDocument.documentElement);
         var  result  =  xpe.evaluate(xpath,  this , nsResolver,  0 ,  null );
         var  found  =  [];
         var  res;
         while  (res  =  result.iterateNext())
            found.push(res);
         return  found;
    }
}

var  x  =  parseXML( " <people>  <person first-name=\ " eric\ "  middle-initial=\ " H\ "  last-name=\ " jung\ " >    <address street=\ " 321  south st\ "  city=\ " denver\ "  state=\ " co\ "  country=\ " usa\ " />    <address street=\ " 123  main st\ "  city=\ " arlington\ "  state=\ " ma\ "  country=\ " usa\ " />  </person>  <person first-name=\ " jed\ "  last-name=\ " brown\ " >    <address street=\ " 321  north st\ "  city=\ " atlanta\ "  state=\ " ga\ "  country=\ " usa\ " />    <address street=\ " 123  west st\ "  city=\ " seattle\ "  state=\ " wa\ "  country=\ " usa\ " />    <address street=\ " 321  south avenue\ "  city=\ " denver\ "  state=\ " co\ "  country=\ " usa\ " />  </person></people> " );

alert( " 搜索所有人的姓氏(last-name) " )
var  results  =  x.selectNodes( " //person/@last-name " );
for  ( var  i = 0 ; i < results.length;i ++ )
  alert( " Person # "   +  i  +   "  has the last name  "   +  results[i].nodeValue);

alert( " 搜索第二个人 " );
//  IE是以0为下标基数的,而不是1 
if ( ! document.all)
    results  =  x.selectSingleNode( " /people/person[2] " );
else 
    results  =  x.selectSingleNode( " /people/person[1] " );
alert(results.xml)

alert( " 获得住址在donver街上的人 " );
results  =  x.selectNodes( " //person[address/@city='denver'] " );
for  ( var  i = 0 ; i < results.length;i ++ )alert(results[i].xml)

if ( ! document.all){
     //  获得所有街名中带south的地址 
    results  =  x.selectNodes( " //address[contains(@street, 'south')] " );
    alert(results[ 0 ].xml);
} else {
    alert( " IE不支持 //address[contains(@street, 'south')] 这种查询方式 " )
}
// --> 
</ SCRIPT > 
</ HEAD > 

< BODY > 

</ BODY > 
</ HTML > 

//demo4( cross brower)
http://kb.mozillazine.org/XPath

Javascript 相关文章推荐
获取body标签的两种方法
Oct 13 Javascript
jQuery判断iframe中元素是否存在的方法
May 11 Javascript
原生javascript模仿win8等待提示圆圈进度条
Apr 24 Javascript
解决jQuery动态获取手机屏幕高和宽的问题
May 07 Javascript
简单介绍JavaScript中字符串创建的基本方法
Jul 07 Javascript
一起学写js Calender日历控件
Apr 14 Javascript
用jQuery获取table中行id和td值的实现代码
May 19 Javascript
vuejs父子组件通信的问题
Jan 11 Javascript
JavaScript函数柯里化原理与用法分析
Mar 31 Javascript
Bootstrap Multiselect 常用组件实现代码
Jul 09 Javascript
详解webpack之scss和postcss-loader的配置
Jan 09 Javascript
JavaScript实现滑动门效果
Jan 18 Javascript
XML+XSL 与 HTML 两种方案的结合
Apr 22 #Javascript
用javascript实现的图片马赛克后显示并切换加文字功能
Apr 21 #Javascript
JS Timing
Apr 21 #Javascript
运用Windows XP附带的Msicuu.exe、Msizap.exe来彻底卸载顽固程序
Apr 21 #Javascript
JS 建立对象的方法
Apr 21 #Javascript
如何做到打开一个页面,过几分钟自动转到另一页面
Apr 20 #Javascript
用javascript将数据库中的TEXT类型数据动态赋值到TEXTAREA中
Apr 20 #Javascript
You might like
ThinkPHP多语言支持与多模板支持概述
2014/08/22 PHP
ThinkPHP中URL路径访问与模块控制器之间的关系
2014/08/23 PHP
ci检测是ajax还是页面post提交数据的方法
2014/11/10 PHP
php自动提交表单的方法(基于fsockopen与curl)
2016/05/09 PHP
CI框架实现框架前后端分离的方法详解
2016/12/30 PHP
JavaScript-世界上误解最深的语言分析
2007/08/12 Javascript
document.designMode的功能与使用方法介绍
2007/11/22 Javascript
javascript中获取下个月一号,是星期几
2012/06/01 Javascript
javascript中一些util方法汇总
2015/06/10 Javascript
jQuery蓝色风格滑动导航栏代码分享
2015/08/19 Javascript
深入解析JavaScript编程中的this关键字使用
2015/11/09 Javascript
浅析javascript的return语句
2015/12/15 Javascript
AngularJS  自定义指令详解及实例代码
2016/09/14 Javascript
详解基于webpack和vue.js搭建开发环境
2017/04/05 Javascript
webpack 2.x配置reactjs基本开发环境详解
2017/08/08 Javascript
深入浅析javascript函数中with
2018/10/28 Javascript
JavaScript console的使用方法实例分析
2020/04/28 Javascript
基于JavaScript实现控制下拉列表
2020/05/08 Javascript
vue 点击其他区域关闭自定义div操作
2020/07/17 Javascript
解决Echarts 显示隐藏后宽度高度变小的问题
2020/07/19 Javascript
[02:57]DOTA2英雄基础教程 风行者
2014/01/16 DOTA
[01:13]2015国际邀请赛线下观战现场
2015/08/08 DOTA
一个基于flask的web应用诞生(1)
2017/04/11 Python
Python cookbook(数据结构与算法)字典相关计算问题示例
2018/02/18 Python
Python数据分析库pandas基本操作方法
2018/04/08 Python
HTML5的一个显示电池状态的API简介
2015/06/18 HTML / CSS
欧洲最大的美妆零售网站:Feelunique
2017/01/14 全球购物
澳大利亚连衣裙和女装在线:Esther
2017/11/11 全球购物
师范大学音乐表演专业求职信
2013/10/23 职场文书
学生会招新策划书
2014/02/14 职场文书
2019消防宣传标语!
2019/07/10 职场文书
html实现随机点名器的示例代码
2021/04/02 Javascript
吃通javascript正则表达式
2021/04/21 Javascript
详细了解java监听器和过滤器
2021/07/09 Java/Android
利用python做数据拟合详情
2021/11/17 Python
Nginx反向代理、重定向
2022/04/13 Servers