DOMParser とは？
■DOMParser とは？
DOMParser は、文字列を解析して、Document オブジェクトを生成するためのクラスです。
DOMParser を利用すると、XML や HTML 文字列から、DOM ツリーを生成する事ができます。
■セキュリティについて
<SCRIPT> 要素などは実行されません。外部リソースへのアクセスは発生しません。
安全に DOM オブジェクトに変換する事ができます。
実際に利用する場合は、さらに消毒化（サニタイズ）を行います。
例えば、<SCRIPT> 要素を除外します。
例えば、先頭に "on" が付くイベント用のプロパティをすべて除外します。
例えば、先頭に "javascript:" が付く URL アドレスをすべて除外します。
■Internet Explorer 8 以前の場合
DOMParser は、Internet Explorer 9 以降で利用可能です。
Internet Explorer 8 以前の場合、かわりに ActiveXObject("Microsoft.XMLDOM") を使用します。
■ブラウザが DOMParser をサポートしているか調べる
ブラウザが、DOMParser クラスをサポートしているか調べるには、window.DOMParser が真であるか比較します。
■文字列から Document オブジェクトを生成する
文字列から Document オブジェクトを生成するには、parseFromString() メソッドを使用します。
DOMParser.parseFromString( "テキスト" , "コンテンツタイプ" ) :Document
| 第01引数 | String | 変換したい XML や HTML などの文字列をセットする。 |
| 第02引数 | String | 第01引数で指定したテキストのコンテンツタイプを指定する。 |
| 戻り値 | Document | 新しい Document オブジェクトが得られる。パースに失敗した場合、例外エラーが発生するか、<parsererror> という要素が付加される。 |
■第02引数（コンテンツタイプ）
第02引数で指定するコンテンツタイプの一覧です。
| 文字列 | 説明 |
| "text/xml" "application/xml" "application/xhtml+xml" | XML 文書 |
| "text/html" | HTML 文書 |
| "image/svg+xml" | SVG |
■使用例
XML 文字列から Document オブジェクトを作成する
// DOMParser に対応している
if(window.DOMParser){
// ------------------------------------------------------------
// XML 文字列を用意する
// ------------------------------------------------------------
var text_xml =
'<?xml version="1.0" encoding="UTF-8"?>\n' +
'<container>\n' +
' <element0 attribute="value0">テキストＡ</element0>\n' +
' <element1 attribute="value1">テキストＢ</element1>\n' +
'</container>';
// ------------------------------------------------------------
// DOMParser オブジェクトを作成する
// ------------------------------------------------------------
var dom_parser = new DOMParser();
// ------------------------------------------------------------
// XML 文字列から Document オブジェクトを作成する
// ------------------------------------------------------------
var document_obj = null;
try {
// XML 文字列から Document オブジェクトを作成する
document_obj = dom_parser.parseFromString(text_xml , "application/xml");
// パースに失敗したか
if(document_obj.getElementsByTagName("parsererror").length){
document_obj = null;
}
}catch(e){
}
// パースに成功した
if(document_obj){
// 出力テスト
console.log(document_obj.documentElement);
}
}
■Document オブジェクトから要素などにアクセスする
Document オブジェクトから、DOM API を使用する事ができます。
要素や属性やテキストなどにアクセスする方法については、こちらで解説しています。
XML 文字列から Document を生成する
■XML 文字列から Document を生成する
■XML 文字列をパースする場合の注意点
XML 文字列は、XML フォーマットとして正確である必要があります。
閉じタグが無いなどの不備がある場合、パースは失敗します。
■XML 文字列から Document オブジェクトを作成する関数
XML 文字列から Document オブジェクトを作成するラッパー関数です。
パースに失敗した場合、null が得られます。
Internet Explorer 6 以降でも動作します。
XML 文字列から Document オブジェクトを作成する関数
// ------------------------------------------------------------
// XML 文字列から Document オブジェクトを作成する関数
// ------------------------------------------------------------
function DOMParserParseFromXMLString(text){
try{
if(window.DOMParser){
var dom_parser = new DOMParser();
var document_obj = dom_parser.parseFromString(text , "application/xml");
if(document_obj.getElementsByTagName("parsererror").length == 0){
return document_obj;
}
}else{
var document_obj = new ActiveXObject("Microsoft.XMLDOM");
document_obj.async = false;
document_obj.loadXML(text);
if(document_obj.documentElement){
return document_obj;
}
}
}catch(e){
}
return null;
}
HTML 文字列から HTMLDocument を生成する
■HTML 文字列から Document を生成する
■HTML 文字列をパースする場合の注意点
古いブラウザによっては、HTML 文字列のパースをサポートしていない場合があります。
HTML 文字列の部分的なパースも可能です。
<HTML> <HEAD> <BODY> 要素は、必ず追加されます。
HTML 文字列に、閉じタグが無いなどの不備があったとしても、最後まで変換されます。（エラーとはなりません）
■HTML 文字列から HTMLDocument オブジェクトを作成する関数
HTML 文字列から HTMLDocument オブジェクトを作成するラッパー関数です。
Internet Explorer 8 以前では動作しません。
ブラウザがサポートしていない場合、null が得られます。
Internet Explorer 9 の場合、<BODY> 要素内の部分的な HTML 文字列のみパースを試みます。
HTML 文字列から HTMLDocument オブジェクトを作成する関数
// ------------------------------------------------------------
// HTML 文字列から HTMLDocument オブジェクトを作成する関数
// ------------------------------------------------------------
function DOMParserParseFromHTMLString(text){
try{
var dom_parser = new DOMParser();
var document_obj = dom_parser.parseFromString(text , "text/html");
if(document_obj.getElementsByTagName("parsererror").length == 0){
return document_obj;
}
}catch(e){
}
try{
var document_obj = document.implementation.createHTMLDocument("");
document_obj.body.innerHTML = text;
return document_obj;
}catch(e){
}
return null;
}