jQuery API の jQuery . parseXML( data ) は、dataに指定したXMLドキュメントをパースする。
引数
- data
パースしたい整形式XML文字列。
戻り値
- XMLDocument
XMLドキュメント。
記述例
var data = '<color><name>赤色</name><colorName>red</colorName><colorCode>#ff0000</colorCode></color>';
var parseXML = jQuery . parseXML( data );
var name = jQuery( parseXML ) . find( 'name' ) . text();
jQuery( '#sample' ) . text( name );
var parseXML = jQuery . parseXML( data );
var name = jQuery( parseXML ) . find( 'name' ) . text();
jQuery( '#sample' ) . text( name );
idが「sample」である要素に、「赤色」と表示する。
実装例（サンプル）
実装例（サンプル）のソースコード
JavaScript
<script type="text/javascript">
<!--
jQuery( function() {
var data = '<colors><color><name>赤色</name><colorName>red</colorName><colorCode>#ff0000</colorCode></color><color><name>青色</name><colorName>blue</colorName><colorCode>#0000FF</colorCode></color><color><name>緑色</name><colorName>green</colorName><colorCode>#008000</colorCode></color></colors>';
var parseXML = jQuery . parseXML( data );
jQuery ( parseXML ) . find( 'color' ) . each( function() {
var name = jQuery ( this ) . find( 'name' ) . text();
var colorName = jQuery ( this ) . find( 'colorName' ) . text();
var colorCode = jQuery ( this ) . find( 'colorCode' ) . text();
var html = '<p style="color:' + colorName + ';">' + name + ':' + colorName + ':' + colorCode + '</p>';
jQuery( '#jquery-sample' ) . append( html );
} );
} );
// -->
</script>
<!--
jQuery( function() {
var data = '<colors><color><name>赤色</name><colorName>red</colorName><colorCode>#ff0000</colorCode></color><color><name>青色</name><colorName>blue</colorName><colorCode>#0000FF</colorCode></color><color><name>緑色</name><colorName>green</colorName><colorCode>#008000</colorCode></color></colors>';
var parseXML = jQuery . parseXML( data );
jQuery ( parseXML ) . find( 'color' ) . each( function() {
var name = jQuery ( this ) . find( 'name' ) . text();
var colorName = jQuery ( this ) . find( 'colorName' ) . text();
var colorCode = jQuery ( this ) . find( 'colorCode' ) . text();
var html = '<p style="color:' + colorName + ';">' + name + ':' + colorName + ':' + colorCode + '</p>';
jQuery( '#jquery-sample' ) . append( html );
} );
} );
// -->
</script>
CSS
<style>
<!--
#jquery-sample {
margin: 10px;
padding: 10px 30px;
background-color: #ffffe0;
border: 1px solid gray;
border-radius: 10px;
}
-->
</style>
<!--
#jquery-sample {
margin: 10px;
padding: 10px 30px;
background-color: #ffffe0;
border: 1px solid gray;
border-radius: 10px;
}
-->
</style>
HTML
<div id="jquery-sample">
</div>
</div>