【JavaScript】 文字列のXMLデータをオブジェクトに変換する方法

文字列でXMLデータを保持しているとき、内容を確認するなら文字列を検索するよりも、一度オブジェクトに変換したほうが利用しやすいです。

そこで今回は、XMLテキストをオブジェクトに変換する方法をお伝えします。

ブラウザ上にドロップしたり、inputタグ経由で取得したXMLファイルを文字列として取得するケースや、直接コード上にXMLデータを文字列で記載するケースがあります。

XMLHttpRequestや$.ajax()を使用して、XMLデータをサーバー上から取得する場合は、自動的にXMLをオブジェクトに変換してくれますが、既に文字列データとして保持している場合は、自分で変換する必要があります。

DOMParserオブジェクトのparseFromString()メソッド

変換にはDOMParserオブジェクトのインスタンスが持っている、parseFromString()メソッドを使用します。

const parser = new window.DOMParser();

const xmlData = parser.parseFromString( xmlString , "text/xml");

第一引数のxmlStringは、XML文字列です。

第二引数は変換をおこなうMIMEタイプで、XML変換は"text/xml"を指定します。

エラー処理

parseFromString()メソッドは、変換エラーの判定が少し特殊です。

XML文書として正しくない文字列が指定されると、parsererrorタグを含んだオブジェクトがリターンされます。

エラーの判定は、次のようなコードでおこないます。

if( xmlData.getElementsByTagName("parsererror").length ){
                        throw new Error( "XMLではない" );
}

値の取得

parseFromString()メソッドは、XMLDocumentオブジェクトをリターンします。
XMLDocumentオブジェクトは、Documenttオブジェクトを継承しているので、getElementsByName()やquerySelectorAll()などのDOM操作メソッドを使用できます。

次のXMLデータを、parseFromString()メソッドでXMLDocumentオブジェクトに変換したとします。

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
    <url>
        <loc>https://note.affi-sapo-sv.com/</loc>
        <lastmod>2020-06-18</lastmod>
        <changefreq>daily</changefreq>
        <priority>1.0</priority>
    </url>
    <url>
        <loc>https://note.affi-sapo-sv.com/programming.php</loc>
        <lastmod>2020-06-18</lastmod>
        <changefreq>daily</changefreq>
        <priority>0.7</priority>
    </url>
</urlset>

次のように、querySelectorAllで要素を取得して、値を出力できます。

const xml =  xmlData.querySelectorAll("urlset url loc");
for( x of xml ){
   console.log( x.textContent );
}

なおDOMParserオブジェクトはブラウザに実装されている機能なので、Node.jsなどのサーバーサイドでは利用できません。

サーバーサイドでXMLデータを利用するには、ライブラリ等を使用する必要があります。

詳しくは次のページを見てください。
参考記事：【Node.js】 単純なXMLファイルを読み込む