MENU

JavaScriptXMLNode.js

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

更新日:2020/06/23

 

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

 

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

 

ブラウザ上で変換する場合

 

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

 

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

 

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

 

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

 

xml文字列をオブジェクトに変換

 


const parser = new window.DOMParser();

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

 

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

 

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

 

エラー処理

 

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

 

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

 

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

 

parseFromString()エラーチェック

 


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

 

 

値の取得

 

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

 

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

 

XMLデータ(文字列)

 


<?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 );
}

 

Node.jsなどサーバーサイドで変換する場合

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

 

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

 

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

けーちゃんおススメJavaScript入門書

  • スラスラ読める JavaScript ふりがなプログラミング
  • プログラム未経験者がJavaScript始めるならコレ!
    コードを掲載して自分で理解しろという投げっぱなしな入門書とは異なり、コードに一つ一つどんなことをやっているかをふりがなという形式で解説しています。
    それでいてJavaScriptの基礎と応用を学べる良書です。
  • これからWebをはじめる人のHTML&CSS、JavaScriptのきほんのきほん
  • JavaScriptの機能を実践で活かすにはHTMLやCSSの知識が不可欠です。
    しかしそれらの知識があることが前提として書かれている書籍が多い中、この本は総合的な知識を身に着けることができます。
    HTMLやCSSの知識も不安な方には、ぴったりの一冊です
  •  

    入門書の役割は、自分のやりたいことをネットで調べることができるようになるための、基礎的な知識の獲得です。
    まずはこれらの本でしっかりと基礎知識を身につけましょう。
    そしてもっと高度なことや専門的なことはネットで調べ、情報が足りないと感じたら書籍を購入してください。


    期間限定情報:
    7/16から7/18は63時間のビッグセール!
    欲しかったアレが安く手に入るチャンスです
    忘れずにチェックしてください!
    僕は以前のタイムセール祭りで4Kモニタが買ったけど、それより安かったらどうしよう・・・

    さらにお得なポイントアップキャンペーンも同時開催!

    記事の内容について

     

    こんにちはけーちゃんです。
    説明するのって難しいですね。


    「なんか言ってることおかしくない?」
    たぶん、こんなご意見あると思います。

    裏付けを取りながら記事を作成していますが、僕の勘違いだったり、そもそも情報源の内容が間違えていたりで、正確でないことが多いと思います。

    そんなときは、ご意見もらえたら嬉しいです。

    ご意見はこちら。
    https://note.affi-sapo-sv.com/info.php

    【お願い】

    お願い

    ■このページのURL


    ■このページのタイトル


    ■リンクタグ


    ※リンクして頂いた方でご希望者には貴サイトの紹介記事を作成してリンクを設置します。
    サイト上部の問い合わせよりご連絡ください。
    ただしサイトのジャンルによっては、お断りさせていただくことがあります。