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

 更新时间:2007年04月22日 00:00:00   作者:  
两段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

相关文章

  • html+js实现简单的计算器代码(加减乘除)

    html+js实现简单的计算器代码(加减乘除)

    下面小编就为大家带来一篇html+js实现简单的计算器代码(加减乘除)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-07-07
  • JavaScript判断浏览器对CSS3属性是否支持的多种方法

    JavaScript判断浏览器对CSS3属性是否支持的多种方法

    其实在使用css3的一些属性时,为了兼顾低端浏览器对CSS3的不友好性,往往需要知道某些浏览器是否支持要使用的CSS3属性,以此来做向下适配。比如常见的CSS3动画就很有必要检测浏览器是否支持。下面本文就分享了几种方法,有需要的朋友们可以参考借鉴。
    2016-11-11
  • BootStrap使用file-input插件上传图片的方法

    BootStrap使用file-input插件上传图片的方法

    这篇文章主要介绍了BootStrap使用file-input插件上传图片的方法,bootstrap的图片上传框架 file-input 插件非常不错,下面小编通过本文介绍下这个插件的使用方法,感兴趣的朋友一起看看吧
    2016-09-09
  • layerUI下的绑定事件实例代码

    layerUI下的绑定事件实例代码

    今天小编就为大家分享一篇layerUI下的绑定事件实例代码,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • 基于代数方程库Algebra.js解二元一次方程功能示例

    基于代数方程库Algebra.js解二元一次方程功能示例

    这篇文章主要介绍了基于代数方程库Algebra.js解二元一次方程功能,结合具体实例形式分析了方程库Algebra.js计算方程的具体使用技巧,需要的朋友可以参考下
    2017-06-06
  • JavaScript作用域与作用域链使用重点讲解

    JavaScript作用域与作用域链使用重点讲解

    当代码在一个环境中执行时,会创建变量对象的一个作用域链,作用域链的用途是保证对执行环境有权访问的所有变量和函数的有序访问,下面这篇文章主要给大家介绍了关于JavaScript作用域与作用域链的相关资料,需要的朋友可以参考下
    2022-10-10
  • jQuery实现div浮动层跟随页面滚动效果

    jQuery实现div浮动层跟随页面滚动效果

    这篇文章主要介绍了jQuery实现div浮动层跟随页面滚动效果,需要的朋友可以参考下
    2014-02-02
  • js实现的简练高效拖拽功能示例

    js实现的简练高效拖拽功能示例

    这篇文章主要介绍了js实现的简练高效拖拽功能,通过对js鼠标事件的扩展实现拖拽效果,非常简单实用,需要的朋友可以参考下
    2016-12-12
  • js获取select标签的值且兼容IE与firefox

    js获取select标签的值且兼容IE与firefox

    本篇文章主要介绍了js获取select标签的值且兼容IE与firefox。需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • JS 特殊运算符的使用

    JS 特殊运算符的使用

    JavaScript中包含了一系列不常见但功能强大的特殊运算符,如空值合并运算符(??)、可选链运算符(?.)等,这些运算符在特定场景下极大地简化了代码的复杂度,并提高了开发效率,通过深入了解这些特殊运算符,开发者可以更加高效地处理各种数据和逻辑
    2024-09-09

最新评论