मेरे पास एक चर स्ट्रिंग है जिसमें अच्छी तरह से गठित और वैध XML है। इस फ़ीड को पार्स करने के लिए मुझे जावास्क्रिप्ट कोड का उपयोग करने की आवश्यकता है।
मैं इसे (ब्राउज़र-संगत) जावास्क्रिप्ट कोड का उपयोग करके कैसे पूरा कर सकता हूं?
मेरे पास एक चर स्ट्रिंग है जिसमें अच्छी तरह से गठित और वैध XML है। इस फ़ीड को पार्स करने के लिए मुझे जावास्क्रिप्ट कोड का उपयोग करने की आवश्यकता है।
मैं इसे (ब्राउज़र-संगत) जावास्क्रिप्ट कोड का उपयोग करके कैसे पूरा कर सकता हूं?
जवाबों:
अपडेट: अधिक सही उत्तर के लिए टिम डाउन का उत्तर देखें ।
इंटरनेट एक्सप्लोरर और, उदाहरण के लिए, मोज़िला-आधारित ब्राउज़र एक्सएमएल पार्सिंग के लिए अलग-अलग वस्तुओं को उजागर करते हैं, इसलिए क्रॉस-ब्राउज़र अंतर को संभालने के लिए jQuery जैसे जावास्क्रिप्ट ढांचे का उपयोग करना बुद्धिमान है ।
वास्तव में मूल उदाहरण है:
var xml = "<music><album>Beethoven</album></music>";
var result = $(xml).find("album").text();नोट: जैसा कि टिप्पणियों में बताया गया है; jQuery वास्तव में किसी भी XML पार्सिंग को नहीं करता है, यह DOM भीतर HTML विधि पर निर्भर करता है और इसे पार्स करेगा जैसे कि यह कोई भी HTML होगा ताकि आपके XML में HTML तत्व नामों का उपयोग करते समय सावधान रहें। लेकिन मुझे लगता है कि यह सरल XML 'पार्सिंग' के लिए काफी अच्छा काम करता है, लेकिन यह शायद गहन या 'डायनामिक' XML पार्सिंग के लिए नहीं सुझाया गया है, जहाँ आप एक्सएमएल में कमी नहीं आने देंगे और अगर सब कुछ उम्मीद के मुताबिक हुआ तो यह परीक्षण करेगा।
innerHTMLएक तत्व की संपत्ति के रूप में असाइन करता है , जो कि बिल्कुल भी विश्वसनीय नहीं है।
jQuery()] HTML को पार्स करता है, XML नहीं "
2017 के लिए अद्यतन उत्तर
निम्नलिखित सभी प्रमुख ब्राउज़रों में XML डॉक्यूमेंट में XML स्ट्रिंग पार्स करेगा। जब तक आपको IE <= 8 या कुछ अस्पष्ट ब्राउज़र के लिए समर्थन की आवश्यकता न हो, आप निम्नलिखित फ़ंक्शन का उपयोग कर सकते हैं:
function parseXml(xmlStr) {
return new window.DOMParser().parseFromString(xmlStr, "text/xml");
}यदि आपको IE <= 8 का समर्थन करने की आवश्यकता है, तो निम्नलिखित कार्य करेगा:
var parseXml;
if (typeof window.DOMParser != "undefined") {
parseXml = function(xmlStr) {
return new window.DOMParser().parseFromString(xmlStr, "text/xml");
};
} else if (typeof window.ActiveXObject != "undefined" &&
new window.ActiveXObject("Microsoft.XMLDOM")) {
parseXml = function(xmlStr) {
var xmlDoc = new window.ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = "false";
xmlDoc.loadXML(xmlStr);
return xmlDoc;
};
} else {
throw new Error("No XML parser found");
}एक बार जब आप के Documentमाध्यम से प्राप्त parseXmlकर लेते हैं, तो आप सामान्य डोम ट्रैवर्सल विधियों / गुणों का उपयोग कर सकते हैं जैसे कि childNodesऔर getElementsByTagName()आप चाहते हैं कि नोड प्राप्त करने के लिए।
उदाहरण का उपयोग:
var xml = parseXml("<foo>Stuff</foo>");
alert(xml.documentElement.nodeName);यदि आप jQuery का उपयोग कर रहे हैं, तो संस्करण 1.5 से आप इसके बिल्ट-इन parseXML()विधि का उपयोग कर सकते हैं , जो ऊपर दिए गए फ़ंक्शन के समान है।
var xml = $.parseXML("<foo>Stuff</foo>");
alert(xml.documentElement.nodeName);$()XML पार्सिंग के लिए उपयोग नहीं करना चाहिए । टिप्पणियों को अधिक ध्यान से पढ़ें: यह बस कई स्थितियों में काम नहीं करता है।
parseXML()विधि एक स्ट्रिंग का उपयोग करती है। मैं जवाब बदलने से थोड़ा सावधान हूं क्योंकि मेरे पास अभी इसका परीक्षण करने का कोई आसान तरीका नहीं है।
वेब पर अधिकांश उदाहरण (और कुछ ऊपर प्रस्तुत किए गए) दिखाते हैं कि किसी फ़ाइल को ब्राउज़र संगत तरीके से XML को कैसे लोड किया जाए । यह Google Chrome के मामले को छोड़कर आसान साबित होता है जो document.implementation.createDocument()विधि का समर्थन नहीं करता है । Chrome का उपयोग करते समय, XML फ़ाइल को XmlDocument ऑब्जेक्ट में लोड करने के लिए, आपको इनबिल्ट XmlHttp ऑब्जेक्ट का उपयोग करने की आवश्यकता होती है और फिर इसे URI पास करके फ़ाइल लोड की जाती है।
आपके मामले में, परिदृश्य अलग है, क्योंकि आप XML को स्ट्रिंग चर से लोड करना चाहते हैं , URL नहीं। हालाँकि, इस आवश्यकता के लिए, क्रोम माना जाता है कि मोजिला की तरह ही काम करता है (या इसलिए मैंने सुना है) और parseFromString () विधि का समर्थन करता है।
यहां एक फ़ंक्शन है जो मैं उपयोग करता हूं (यह ब्राउज़र संगतता लाइब्रेरी का हिस्सा है जो मैं वर्तमान में बना रहा हूं):
function LoadXMLString(xmlString)
{
// ObjectExists checks if the passed parameter is not null.
// isString (as the name suggests) checks if the type is a valid string.
if (ObjectExists(xmlString) && isString(xmlString))
{
var xDoc;
// The GetBrowserType function returns a 2-letter code representing
// ...the type of browser.
var bType = GetBrowserType();
switch(bType)
{
case "ie":
// This actually calls into a function that returns a DOMDocument
// on the basis of the MSXML version installed.
// Simplified here for illustration.
xDoc = new ActiveXObject("MSXML2.DOMDocument")
xDoc.async = false;
xDoc.loadXML(xmlString);
break;
default:
var dp = new DOMParser();
xDoc = dp.parseFromString(xmlString, "text/xml");
break;
}
return xDoc;
}
else
return null;
}if(window.ActiveXObject){...}
var dp; try{ dp = new DOMParser() } catch(e) { }; if(dp) { // DOMParser supported } else { // alert('you need to consider upgrading your browser\nOr pay extra money so developer can support the old versions using browser sniffing (eww)') }।
Marknote एक अच्छा हल्का क्रॉस-ब्राउज़र जावास्क्रिप्ट XML पार्सर है। यह ऑब्जेक्ट-ओरिएंटेड है और इसे बहुत सारे उदाहरण मिले हैं, साथ ही एपीआई का दस्तावेजीकरण किया गया है। यह काफी नया है, लेकिन इसने अब तक मेरी एक परियोजना में अच्छा काम किया है। एक बात जो मुझे पसंद है, वह यह है कि यह XML को स्ट्रिंग्स या URL से सीधे पढ़ेगी और आप इसका उपयोग XML को JSON में बदलने के लिए भी कर सकते हैं।
यहाँ एक उदाहरण है कि आप मार्कनेट के साथ क्या कर सकते हैं:
var str = '<books>' +
' <book title="A Tale of Two Cities"/>' +
' <book title="1984"/>' +
'</books>';
var parser = new marknote.Parser();
var doc = parser.parse(str);
var bookEls = doc.getRootElement().getChildElements();
for (var i=0; i<bookEls.length; i++) {
var bookEl = bookEls[i];
// alerts "Element name is 'book' and book title is '...'"
alert("Element name is '" + bookEl.getName() +
"' and book title is '" +
bookEl.getAttributeValue("title") + "'"
);
}मैंने हमेशा नीचे के दृष्टिकोण का उपयोग किया है जो IE और फ़ायरफ़ॉक्स में काम करता है।
उदाहरण XML:
<fruits>
<fruit name="Apple" colour="Green" />
<fruit name="Banana" colour="Yellow" />
</fruits>जावास्क्रिप्ट:
function getFruits(xml) {
var fruits = xml.getElementsByTagName("fruits")[0];
if (fruits) {
var fruitsNodes = fruits.childNodes;
if (fruitsNodes) {
for (var i = 0; i < fruitsNodes.length; i++) {
var name = fruitsNodes[i].getAttribute("name");
var colour = fruitsNodes[i].getAttribute("colour");
alert("Fruit " + name + " is coloured " + colour);
}
}
}
}innerTextइसके स्थान पर उपयोग की जरूरत हैgetAttribute()
जाहिरा तौर पर jQuery अब संस्करण 1.5 के रूप में jQuery.parseXML http://api.jquery.com/jQuery.parseXML/ प्रदान करता है
jQuery.parseXML( data )
यह दिखाता है: XMLDocument
कृपया XML DOM Parser ( W3Schools ) पर एक नज़र डालें । यह XML DOM पार्सिंग पर एक ट्यूटोरियल है। वास्तविक DOM पार्सर ब्राउज़र से ब्राउज़र में भिन्न होता है लेकिन DOM API मानकीकृत होता है और समान (कम या ज्यादा) रहता है।
वैकल्पिक रूप से E4X का उपयोग करें यदि आप अपने आप को फ़ायरफ़ॉक्स तक सीमित कर सकते हैं । इसका उपयोग करना अपेक्षाकृत आसान है और यह संस्करण 1.6 से जावास्क्रिप्ट का हिस्सा है। यहाँ एक छोटा सा नमूना उपयोग है ...
//Using E4X
var xmlDoc=new XML();
xmlDoc.load("note.xml");
document.write(xmlDoc.body); //Note: 'body' is actually a tag in note.xml,
//but it can be accessed as if it were a regular property of xmlDoc.<script language="JavaScript">
function importXML()
{
if (document.implementation && document.implementation.createDocument)
{
xmlDoc = document.implementation.createDocument("", "", null);
xmlDoc.onload = createTable;
}
else if (window.ActiveXObject)
{
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.onreadystatechange = function () {
if (xmlDoc.readyState == 4) createTable()
};
}
else
{
alert('Your browser can\'t handle this script');
return;
}
xmlDoc.load("emperors.xml");
}
function createTable()
{
var theData="";
var x = xmlDoc.getElementsByTagName('emperor');
var newEl = document.createElement('TABLE');
newEl.setAttribute('cellPadding',3);
newEl.setAttribute('cellSpacing',0);
newEl.setAttribute('border',1);
var tmp = document.createElement('TBODY');
newEl.appendChild(tmp);
var row = document.createElement('TR');
for (j=0;j<x[0].childNodes.length;j++)
{
if (x[0].childNodes[j].nodeType != 1) continue;
var container = document.createElement('TH');
theData = document.createTextNode(x[0].childNodes[j].nodeName);
container.appendChild(theData);
row.appendChild(container);
}
tmp.appendChild(row);
for (i=0;i<x.length;i++)
{
var row = document.createElement('TR');
for (j=0;j<x[i].childNodes.length;j++)
{
if (x[i].childNodes[j].nodeType != 1) continue;
var container = document.createElement('TD');
var theData = document.createTextNode(x[i].childNodes[j].firstChild.nodeValue);
container.appendChild(theData);
row.appendChild(container);
}
tmp.appendChild(row);
}
document.getElementById('writeroot').appendChild(newEl);
}
</script>
</HEAD>
<BODY onLoad="javascript:importXML();">
<p id=writeroot> </p>
</BODY>अधिक जानकारी के लिए इसे देखें http://www.easycodingclub.com/xml-parser-in-javascript/javascript-putorials/
अस्वीकरण : मैंने फास्ट-एक्सएमएल-पार्सर बनाया है
मैंने जेएस / जेएसएन ऑब्जेक्ट या इंटरमीडिएट ट्रैवर्सल ऑब्जेक्ट में एक्सएमएल स्ट्रिंग पार्स करने के लिए फास्ट-एक्सएमएल-पार्सर बनाया है । यह सभी ब्राउज़रों (हालांकि क्रोम, फ़ायरफ़ॉक्स और आईई पर परीक्षण किया गया) में संगत होने की उम्मीद है।
प्रयोग
var options = { //default
attrPrefix : "@_",
attrNodeName: false,
textNodeName : "#text",
ignoreNonTextNodeAttr : true,
ignoreTextNodeAttr : true,
ignoreNameSpace : true,
ignoreRootElement : false,
textNodeConversion : true,
textAttrConversion : false,
arrayMode : false
};
if(parser.validate(xmlData)){//optional
var jsonObj = parser.parse(xmlData, options);
}
//Intermediate obj
var tObj = parser.getTraversalObj(xmlData,options);
:
var jsonObj = parser.convertToJson(tObj);नोट : यह DOM पार्सर का उपयोग नहीं करता है, लेकिन RE का उपयोग करते हुए स्ट्रिंग को पार्स करता है और इसे JS / JSON ऑब्जेक्ट में परिवर्तित करता है।
आप xml स्ट्रिंग में हेरफेर करने के लिए jquery फ़ंक्शन ($ parseXML) के माध्यम से भी कर सकते हैं
उदाहरण जावास्क्रिप्ट:
var xmlString = '<languages><language name="c"></language><language name="php"></language></languages>';
var xmlDoc = $.parseXML(xmlString);
$(xmlDoc).find('name').each(function(){
console.log('name:'+$(this).attr('name'))
})