programing

JavaScript를 사용하여 XML 구문 분석

muds 2023. 9. 14. 00:03
반응형

JavaScript를 사용하여 XML 구문 분석

자바스크립트를 이용해서 XML을 파싱할 수 있어야 합니다.XML은 변수에 포함됩니다.저는 jQuery나 다른 프레임워크를 사용하지 않기를 원합니다.

XML > jQuery reading 이것을 보았습니다.

이 질문을 하기 20분 전에 마지막으로 질문하신 내용을 보면 GeoNames의 FindNearestAddress를 사용하여 찾은 XML을 파싱(읽기 및 변환)하려고 하는 것 같습니다.

XML이 다음 문자열 변수에 있는 경우txt다음과 같이 보입니다.

<address>
  <street>Roble Ave</street>
  <mtfcc>S1400</mtfcc>
  <streetNumber>649</streetNumber>
  <lat>37.45127</lat>
  <lng>-122.18032</lng>
  <distance>0.04</distance>
  <postalcode>94025</postalcode>
  <placename>Menlo Park</placename>
  <adminCode2>081</adminCode2>
  <adminName2>San Mateo</adminName2>
  <adminCode1>CA</adminCode1>
  <adminName1>California</adminName1>
  <countryCode>US</countryCode>
</address>

그러면 다음과 같이 자바스크립트 DOM으로 XML을 구문 분석할 수 있습니다.

if (window.DOMParser)
{
    parser = new DOMParser();
    xmlDoc = parser.parseFromString(txt, "text/xml");
}
else // Internet Explorer
{
    xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.async = false;
    xmlDoc.loadXML(txt);
}

그리고 다음과 같은 노드에서 특정 값을 가져옵니다.

//Gets house address number
xmlDoc.getElementsByTagName("streetNumber")[0].childNodes[0].nodeValue;

//Gets Street name
xmlDoc.getElementsByTagName("street")[0].childNodes[0].nodeValue;

//Gets Postal Code
xmlDoc.getElementsByTagName("postalcode")[0].childNodes[0].nodeValue;

JSFiddle


2019년 2월 편집:

네임스페이스 접두사가 있는 xml에 대한 @gaugeinvariante의 우려에 대한 응답입니다.네임스페이스 접두사를 사용하여 xml을 구문 분석해야 하는 경우에는 모든 것이 거의 동일하게 작동해야 합니다.

참고: Microsoft Edge와 같은 xml 네임스페이스 접두사를 지원하는 브라우저에서만 작동합니다.

// XML with namespace prefixes 's', 'sn', and 'p' in a variable called txt
txt = `
<address xmlns:p='example.com/postal' xmlns:s='example.com/street' xmlns:sn='example.com/streetNum'>
  <s:street>Roble Ave</s:street>
  <sn:streetNumber>649</sn:streetNumber>
  <p:postalcode>94025</p:postalcode>
</address>`;

//Everything else the same
if (window.DOMParser)
{
    parser = new DOMParser();
    xmlDoc = parser.parseFromString(txt, "text/xml");
}
else // Internet Explorer
{
    xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.async = false;
    xmlDoc.loadXML(txt);
}

//The prefix should not be included when you request the xml namespace
//Gets "streetNumber" (note there is no prefix of "sn"
console.log(xmlDoc.getElementsByTagName("streetNumber")[0].childNodes[0].nodeValue);

//Gets Street name
console.log(xmlDoc.getElementsByTagName("street")[0].childNodes[0].nodeValue);

//Gets Postal Code
console.log(xmlDoc.getElementsByTagName("postalcode")[0].childNodes[0].nodeValue);

다음은 Internet Explorer 6을 포함한 모든 주요 브라우저에서 XML 문자열을 XML 문서로 구문 분석합니다.그러면 일반적인 DOM 순회 메서드/속성(예: childNodes) 및 getElementsByTagName()을 사용하여 원하는 노드를 가져올 수 있습니다.

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

사용 예시:

var xml = parseXml("<foo>Stuff</foo>");
alert(xml.documentElement.nodeName);

https://stackoverflow.com/a/8412989/1232175 에서 얻은 정보입니다.

언급URL : https://stackoverflow.com/questions/17604071/parse-xml-using-javascript

반응형