【 Javascript 】
2006年04月07日 
XMLパーサー(xmlparser.js) ver0.1.0
Ajax経由で受け取ったXMLHTTPRequest.responseXML.documentElementをシンプルな形式でアクセス可能にするXMLパーサーです(javascriptライブラリ)。
DOMで直接アクセスするのがややこしい、面倒くさい場合に役立つライブラリです。
※ブラウザ依存の処理はほとんどないので汎用的に使えると思います。
(文字コード（バグ？）の関係でSafariでは動かないかもしれません。今後対応予定)
pathメソッドが味噌です。
[ダウンロード]
[簡単なサンプル]
Ajax部分はprototype.jsを使用しています（サンプルなので実際にはprototype.jsである必要はありません。Yahoo!UIライブラリや自作のライブラリでも動作します）。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>xmlparser.js Test</title>
<script type="text/javascript" src="./prototype.js"></script>
<script type="text/javascript" src="./xmlparser.js"></script>
<script>
function loadXML(){
var url = './test.xml';
new Ajax.Request(url, {
method: 'get',
onComplete: function(request){
var xml = XMLParser.parse(request.responseXML.documentElement); // 1
$('result').innerHTML = xml.dumpHTML(); // 2
}
});
}
</script>
</head>
<body onload="loadXML();">
<div id="result"style="white-space:nowrap;" ></div>
</body>
</html>XMLParserの処理は赤字で書いた２行だけです。XMLParser.parse(documentElement)でdocumentElementを解析し、xml.dumpHTML()でxmlの内容を全てHTMLで吐き出しています。
以下、xml（小文字）という表記は
var xml = XMLParser.parse(request.responseXML.documentElement);
で作成したxmlを指します。
[XMLノードへのアクセス]
例えば、test.xmlの中身が以下のようなデータとします（適当なのは気にしないでください）。<?xml version="1.0" encoding="UTF-8"?> <aaa> <bbb xxx="bbbの属性１" yyy="bbbの属性２">bbbの値</bbb> <ccc> <ddd>dddの値１</ddd> <ddd>dddの値２</ddd> </ccc> </aaa>
例えば、"bbb"のXMLノードを取得するには、
と、記述すれば取得できます。もっと具体的に書くと、
var bbb = xml.path('aaa->bbb');
alert(bbb.name + ':' + bbb.value);
alert(bbb.getAttribute('xxx').name + ':' + bbb.getAttribute('xxx').value);
alert(bbb.getAttribute('yyy').name + ':' + bbb.getAttribute('yyy').value);こんな感じで直感的にXMLデータにアクセスすることができます。
※必ずしもxmlからpathメソッドを呼び出さなくても、bbb.path('・・・')というように、各々のノードでも同様の処理ができます。
例ではdddは２つありますが、この場合は"dddの配列"が作成されます。アクセス方法としては、
xml.path('aaa->ccc->ddd->0') または、 xml.path('aaa->ccc->ddd')[0]
という風に書くこともできます。配列なのでもちろんループ等も自由です。
【各クラス解説】
[XMLParserクラス]
| メソッド | パラメータ | 説明 |
| parse(documentElement) | documentElement：基本的にはXMLHTTPRequest.responseXML.documentElement | DOMを解析して、XMLParser.Elementを作成する。 |
[XMLParser.Elementクラス]
| メソッド | パラメータ | 説明 |
| path(path) | path：XMLの走査順序を'->'区切りで指定 | pathに当たるXMLParser.Nodeを取得する |
| dumpHTML() | XMLデータをダンプし、HTMLにて出力する（重いのであくまでデバッグ・確認用）。 | |
| dump() | XMLをダンプし、その配列を返す。dump().join('\n')、dump().join('<br />')という風に使用する（重いのでデバッグ・確認用）。 |
[XMLParser.Nodeクラス]
| メンバ変数 | 説明 |
| parent | 親のXMLParser.Node |
| attributes | 自身の属性（javascriptのattributesと同じ） |
| name | 自身のタグ名 |
| value | 自身の値 |
| メソッド | パラメータ | 説明 |
| path(path) | path：XMLの走査順序を'->'区切りで指定 | XMLParser.Elementと同じ |
| getParent() | 親のXMLParser.Nodeを取得 | |
| getName() | 自身のXMLタグ名を取得 | |
| getValue() | 自身の値を取得 | |
| getAttribute(name) | name: 属性名称 | 属性名称から属性(Attr)を取得 |
| getAttributes() | 自身の属性(Attr)を全て取得 | |
| dumpHTML() | XMLParser.Elementと同じ。 | |
| dump() | XMLParser.Elementと同じ。 |
※属性に関しては、javascriptのattributes(Attr)の挙動と同じ（というかそのもの）です。もう少し書くと、XMLParser.Nodeと同じようにname、valueにて名称、値を取り出すことができます。
[もう一つのアクセス方法]
実際にはもう一つのアクセス方法があります。おそらくpathメソッドを使ったほうが分かりやすいですが、更に高速に処理しようと思えば、$+'XMLタグ名'という形式でアクセス可能です。
xml.$aaa.$ccc.$ddd[0].value
こんな感じでアクセスすることができます。頭に'$'が付いているのは、name,value,その他メソッド名と重複させない為です。また、javascriptで使えて、XMLで使えない先頭文字というと、'$'くらいしかないというところも大きいですが・・・。とりあえず試行錯誤の結果生まれたアクセス方法番外編でした（これを使う必要はありません）。
投稿者 shiz : 2006年04月07日 23:29
トラックバック
このエントリーのトラックバックURL:
http://mt.amonya.com/mt-tb.cgi/38
※トラックバックのリンク確認後に掲載させて頂きます。
（当エントリー又は当サイトへのリンクがない場合は掲載しません）
» Ajax(非同期通信 + XML) と PHP5 で Amazon の検索システムを実現 from TK-BLOG
Amazon 検索 使い方は簡単。任意のキーワードを打ち込めば上位 16 件の... [続きを読む]
トラックバック時刻: 2008年08月03日 21:30
