JavaScriptが実現したXMLとJSONの相互転送機能の詳細

9901 ワード

本論文の実例は、JavaScriptが実現したXMLとJSONの相互転送機能について述べている.皆さんに参考にしてあげます.具体的には以下の通りです.
ここではJavaScriptがXMLとJSONの相互転送を実現する例を紹介します.この中で海外の3種類のxmlがJSONに転じる例を紹介しています.これらの例があなたを助けてくれることを願っています.
最近オンラインXMLエディタを開発しています.JSONを中間フォーマットにしたいです.JSONはXMLに対して、読みやすく、解析速度が速い、スペースが小さいなどの利点があり、WEB上でデータを転送しやすいからです.しかし実際の使用においては無視しやすい詳細がいくつか発見されており、XMLの元の構造を厳格に保証する必要がある場合には、JSONに変換する際に注意が必要である.
XMLをJSONに変換するフォーマットは大体以下の通りです.
XML形式


JSON表現形式

{
"article": {
"header": {
"#text": "    ",
"@id": "h1"
},
"section": {
"@id": "s1",
"header": "    ",
"p": "    "
}
}
}
 
JsでXMLをJSONのシナリオに変換して、ネット上でいくつかの既製のシナリオを探して、しかし大部分が比較的に簡単な情況を満たすだけ、すべて元の構造の相互回転を保証することができません.以下はネットで見つけたシナリオや文章です.
x 2 js  : https://code.google.com/p/x2js/
jsonxml:http://davidwalsh.name/convert-xml-json
JKL.PaseXML:http://www.kawa.net/works/js/jkl/parsexml-e.html
x 2 jsは下記のXMLを正確に元に戻すことはできません.

//XML  

2番目のスクリプトjsoxmlは、上のような「テキスト混合ラベル」の場合は、ラベルを抽出することなく、次のようなフォーマットに変換されます.

{"p":"    "}}

その後、いくつかの変更を行いましたが、それを下記の形式に解析して、「テキスト混合ラベル」が正しく再現できる状況を満たしました.

{"p":[{"strong":"  "}," ",{"em":" "}]}

また、以下のコードのような形をして、上記のスクリプトを用いて変換しても、正しく再現できない場合があります.

同じように、ラベル内では、サブラベルが一度より大きい場合、データを記録するパスが必要な場合は、この構造を保存するために配列を使用すべきである.正しいコードは、

{
  "article": [ {
  "section": {
  "#text": "   ",
  "@id": "s1"
  },
  }, {
  "header": {
  "#text": "  ",
  "@id": "h1"
  }
  }, {
  "section": {
  "#text": "   ",
  "@id": "s2"
  }
  }
  ]
}

jkl.parsexml



 
  10036
  NY
  New York
  Broadway
 


SAMPLE SCRIPT:


<!--
  var url = "zip-e.xml";
  var xml = new JKL.ParseXML( url );
  var data = xml.parse();
  document.write( data["items"]["item"]["us_state"] );
  document.write( data.items.item.us_state );
// -->

OUT JSON:

{
 items: {
  item: {
   zip_cd: "1000001"
   us_state: "NY",
   us_city: "New York",
   us_dist: "Broadway",
  }
 }
};

jsonxml

// Changes XML to JSON
function xmlToJson(xml) {
 // Create the return object
 var obj = {};
 if (xml.nodeType == 1) { // element
 // do attributes
 if (xml.attributes.length > 0) {
 obj["@attributes"] = {};
  for (var j = 0; j < xml.attributes.length; j++) {
  var attribute = xml.attributes.item(j);
  obj["@attributes"][attribute.nodeName] = attribute.nodeValue;
  }
 }
 } else if (xml.nodeType == 3) { // text
 obj = xml.nodeValue;
 }
 // do children
 if (xml.hasChildNodes()) {
 for(var i = 0; i < xml.childNodes.length; i++) {
  var item = xml.childNodes.item(i);
  var nodeName = item.nodeName;
  if (typeof(obj[nodeName]) == "undefined") {
  obj[nodeName] = xmlToJson(item);
  } else {
  if (typeof(obj[nodeName].push) == "undefined") {
   var old = obj[nodeName];
   obj[nodeName] = [];
   obj[nodeName].push(old);
  }
  obj[nodeName].push(xmlToJson(item));
  }
 }
 }
 return obj;
};

The major change I needed to implement was using atributes.item(j)instead of the atributes[j]that most of the scripts I found used.  With this function、XML that looks like:


 
 
 <linksin num="1102"/>
 <speed text="1421" pct="51"/>
 </sd>
 <sd>
 <popularity url="davidwalsh.name/" text="7131"/>
 <reach rank="5952"/>
 <rank delta="-1648"/>
 </sd>
</alexa>

</code></pre> 
 </div> 
 <p>...becomes workable a JavaScript object with the following structure:</p> 
 <div class="jb51code"> 
  <pre><code>
{
 "@attributes": {
 AID: "=",
 HOME: 0,
 URL: "davidwalsh.name/",
 VER: "0.9",
 },
 SD = [
 {
  "@attributes": {
  FLAGS: "",
  HOST: "davidwalsh.name",
  TITLE: A
  },
  LINKSIN: {
  "@attributes": {
   NUM: 1102
  }
  },
  SPEED: {
  "@attributes": {
   PCT: 51,
   TEXT: 1421
  }
  },
  TITLE: {
  "@attributes": {
   TEXT: "David Walsh Blog :: PHP, MySQL, CSS, Javascript, MooTools, and Everything Else",
  }
  },
 },
 {
  POPULARITY: {
  "@attributes": {
   TEXT: 7131,
   URL: "davidwalsh.name/"
  }
  },
  RANK: {
  "@attributes": {
   DELTA: "-1648"
  }
  },
  REACH: {
  "@attributes": {
   RANK = 5952
  }
  }
 }
 ]
}

</code></pre> 
 </div> 
 <p>             </p> 
 <div class="jb51code"> 
  <pre><code>
function xmlToJson(xml) {
// Create the return object
var obj = {};
if (xml.nodeType == 1) { // element
// do attributes
if (xml.attributes.length > 0) {
obj["@attributes"] = {};
for (var j = 0; j < xml.attributes.length; j++) {
var attribute = xml.attributes.item(j);
obj["@attributes"][attribute.nodeName] = attribute.nodeValue;
}
}
} else if (xml.nodeType == 3) { // text
obj = xml.nodeValue;
}
// do children
if (xml.hasChildNodes()) {
for (var i = 0; i < xml.childNodes.length; i++) {
var item = xml.childNodes.item(i);
var nodeName = item.nodeName;
if (typeof (obj[nodeName]) == "undefined") {
obj[nodeName] = xmlToJson(item);
} else {
if (typeof (obj[nodeName].length) == "undefined") {
var old = obj[nodeName];
obj[nodeName] = [];
obj[nodeName].push(old);
}
obj[nodeName].push(xmlToJson(item));
}
}
}
return obj;
};

</code></pre> 
 </div> 
 <p><span style="color: #800000"><strong>PS:            xml json              :</strong></span></p> 
 <p><span style="color: #ff6600"><strong>  <span style="color: #ff0000">XML</span>/<span style="color: #ff0000">JSON</span>      :<br/> </strong></span>http://tools.jb51.net/code/xmljson</p> 
 <p><span style="color: #ff6600"><strong>     <span style="color: #ff0000">XML</span>/    <span style="color: #ff0000">XML</span>:<br/> </strong></span>http://tools.jb51.net/code/xmlformat</p> 
 <p><span style="color: #ff0000"><strong>XML</strong></span><span style="color: #ff6600"><strong>    /     :<br/> </strong></span>http://tools.jb51.net/code/xml_format_compress</p> 
 <p><span style="color: #ff6600"><strong>  <span style="color: #ff0000">JSON</span>    、  、  、     :<br/> </strong></span>http://tools.jb51.net/code/json</p> 
 <p><span style="color: #ff0000"><strong>JSON</strong></span><span style="color: #ff6600"><strong>       :<br/> </strong></span>http://tools.jb51.net/code/jsonformat</p> 
 <p><span style="color: #ff6600"><strong>  <span style="color: #ff0000">json</span>  /    :<br/> </strong></span>http://tools.jb51.net/code/json_yasuo_trans</p> 
 <p>    JavaScript           :《JavaScript ajax      》、《JavaScript  XML      》、《JavaScript json      》、《JavaScript         》 《JavaScript           》</p> 
 <p>         JavaScript        。</p> 
 <div class="clearfix"> 
  <span id="art_bot" class="jbTestPos"/> 
 </div> 
</div>
                            </div>
                        </div>