XML string/xml file loaded and parsed in JavaScript

Source: Internet
Author: User
Tags xpath

First of all, we need to load this XML file, JS load XML file, is through the XMLDOM.

The code is as follows Copy Code

<?xml version= "1.0" encoding= "Utf-8"?>
<DongFang>
<Company>
<cNname>1</cNname>
<cIP>1</cIP>
</Company>
<Company>
<cNname>2</cNname>
<cIP>2</cIP>
</Company>
<Company>
<cNname>3</cNname>
<cIP>3</cIP>
</Company>
<Company>
<cNname>4</cNname>
<cIP>4</cIP>
</Company>
<Company>
<cNname>5</cNname>
<cIP>5</cIP>
</Company>
<Company>
<cNname>6</cNname>
<cIP>6</cIP>
</Company>
</DongFang>

Htm


<script type= ' Text/javascript ' >
Loadxml = function (xmlstring) {
var xmldoc=null;
Determine the type of browser
Support IE browser
if (!window. Domparser && windows. ActiveXObject) {//window. Domparser to determine if it is a non IE browser
var xmldomversions = [' msxml.2.domdocument.6.0 ', ' msxml.2.domdocument.3.0 ', ' microsoft.xmldom '];
for (Var i=0;i<xmldomversions.length;i++) {
try{
xmldoc = new ActiveXObject (xmldomversions[i]);
Xmldoc.async = false;
Xmldoc.loadxml (xmlstring); The Loadxml method loads an XML string
Break
}catch (e) {
}
}
}
Support Mozilla Browser
else if (window. Domparser && document.implementation && document.implementation.createDocument) {
try{
/* The Domparser object parses the XML text and returns an XML Document object.
* To use Domparser, instantiate it with a constructor without parameters, and then call its parsefromstring () method
* Parsefromstring (text, contentType) parameter text: The content type of the XML tag parameter contentType text to parse
* May be one of the "Text/xml", "Application/xml" or "Application/xhtml+xml". Note that "text/html" is not supported.
*/
Domparser = new Domparser ();
xmldoc = domparser.parsefromstring (xmlstring, ' text/xml ');
}catch (e) {
}
}
else{
return null;
}

return xmldoc;
}
</script>
<body>
</body>

How to use

The code is as follows Copy Code

var xmldoc=loadxml (Text.xml)

var elements = Xmldoc.getelementsbytagname ("Company");

for (var i = 0; i < elements.length; i++) {
var name = Elements[i].getelementsbytagname ("Cnname") [0].firstchild.nodevalue;
var ip = elements[i].getelementsbytagname ("CIP") [0].firstchild.nodevalue;

}


Instance

The code is as follows Copy Code

<script type= "Text/javascript" >
function Parsexml ()
{
text= "<note>";
text=text+ "<to>George</to>";
text=text+ "<from>John</from>";
text=text+ "text=text+ "<body>don ' t forget the meeting!</body>";
text=text+ "</note>";
Try//internet Explorer
{
Xmldoc=new ActiveXObject ("Microsoft.XMLDOM");
Xmldoc.async= "false";
Xmldoc.loadxml (text);
}
catch (E)
{
Try//firefox, Mozilla, Opera, etc.
{
Parser=new Domparser ();
Xmldoc=parser.parsefromstring (text, "Text/xml");
}
catch (E)
{
alert (e.message);
Return
}
}
document.getElementById ("to"). Innerhtml=xmldoc.getelementsbytagname ("to") [0].childnodes[0].nodevalue;
document.getElementById ("from"), Innerhtml=xmldoc.getelementsbytagname ("from") [0].childnodes[0].nodevalue;
document.getElementById ("message"). Innerhtml=xmldoc.getelementsbytagname ("The Body") [0].childnodes[0].nodevalue;
}
</script>

<body onload= "Parsexml ()" >
<p><b>To:</b> <span id= "to" ></span>

<b>From:</b> <span id= "from" ></span>

<b>Message:</b> <span id= "message" ></span>
</p>
</body>

Friendship Tips If parsing an XML document we can't use the above method,

The code is as follows Copy Code

<script type= ' Text/javascript ' >
Loadxml = function (xmlFile) {
var xmldoc=null;
Determine the type of browser
Support IE browser
if (!window. Domparser && windows. ActiveXObject) {
var xmldomversions = [' msxml.2.domdocument.6.0 ', ' msxml.2.domdocument.3.0 ', ' microsoft.xmldom '];
for (Var i=0;i<xmldomversions.length;i++) {
try{
xmldoc = new ActiveXObject (xmldomversions[i]);
Break
}catch (e) {
}
}
}
Support Mozilla Browser
else if (document.implementation && document.implementation.createDocument) {
try{
/* Document.implementation.createDocument (",", null); Three parameter description of the method
* The first parameter is a string containing the namespace URI used by the document;
* The second parameter is a string containing the name of the root element of the document;
* The third parameter is the type of document to create (also known as DOCTYPE)
*/
xmldoc = Document.implementation.createDocument (",", null);
}catch (e) {
}
}
else{
return null;
}

if (xmldoc!=null) {
Xmldoc.async = false;
Xmldoc.load (XmlFile);
}
return xmldoc;
}
</script>


Can be passed xmlDoc.documentElement.childNodes (1). ChildNodes (0). getattribute (' Text ') is accessed.
Some common methods:
XmlDoc.documentElement.childNodes (0). nodename, you can get the name of this node.
XmlDoc.documentElement.childNodes (0). NodeValue, you can get the value of this node. This value is derived from this XML format: <A>B</B>, so you can get the value of B.
XmlDoc.documentElement.childNodes (0). Haschild, you can determine whether there are child nodes

In my experience, it is best to use the getElementsByTagName (XPath) approach to access the nodes, as this can be done directly through XPath to locate the node, which would have better performance.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.