Lucrul cu XML

Unul dintre formatele populare pentru descrierea datelor este formatul XML. Și limbajul JavaScript oferă unelte pentru lucrul cu XML.

Transformarea din șir în XML

Pentru crearea obiectelor XML pe baza unui șir care conține date în format XML, se folosește obiectul DOMParser. Metodei parseFromString() i se poate transmite șirul corespunzător ca prim argument și tipul MIME (de obicei text/xml) ca al doilea argument. Dacă șirul transmis conține cod XML corect, atunci metoda va returna un obiect de tip Document, care va conține XML-ul analizat.

Și pentru a selecta date specifice din documentul XML obținut, se pot folosi metodele standard de selectare a elementelor DOM, de exemplu, querySelector().

De exemplu, să luăm în considerare următorul program:

const xmlString = `<?xml version="1.0" encoding="UTF-8" ?>
   <users>
       <user name="Tom" age="39">
           <company>
               <title>Microsoft</title>
           </company>
       </user>
       <user name="Bob" age="43">
           <company>
               <title>Google</title>
           </company>
       </user>
   </users>`;

const domParser = new DOMParser();
const xmlDOM = domParser.parseFromString(xmlString, "text/xml");
// accesăm primul element user
const firstUser = xmlDOM.querySelector("user");
console.log(firstUser.getAttribute("name"));                  // Tom
console.log(firstUser.getAttribute("age"));                  // 39
console.log(firstUser.querySelector("title").textContent);    // Microsoft

Aici documentul xml este dat ca șir xmlString. Dar deocamdată este doar un șir, nu un document xml. Și pentru parsarea șirului în document xml se creează obiectul DOMParser și se execută metoda sa parseFromString(), în care se transmite șirul nostru:

const domParser = new DOMParser();
const xmlDOM = domParser.parseFromString(xmlString, "text/xml");

După ce obținem documentul xml, selectăm primul element user cu ajutorul metodei querySelector:

const firstUser = xmlDOM.querySelector("user");

Apoi putem accesa conținutul elementului user - la elementele și atributele încorporate:

console.log(firstUser.getAttribute("name"));                  // Tom
console.log(firstUser.getAttribute("age"));                  // 39
console.log(firstUser.querySelector("title").textContent);    // Microsoft

Serializarea documentului XML în șir

Pentru transformarea inversă - din document xml în șir, se folosește obiectul XMLSerializer. Acest obiect oferă metoda serializeToString(), care primește obiectul XML și returnează obiectul XML sub formă de șir. De exemplu:

const xmlString = `<?xml version="1.0" encoding="UTF-8" ?>
   <users>
       <user name="Tom" age="39">
           <company>
               <title>Microsoft</title>
           </company>
       </user>
       <user name="Bob" age="43">
           <company>
               <title>Google</title>
           </company>
       </user>
   </users>`;

// transformăm șirul în XML
const domParser = new DOMParser();
const xmlDOM = domParser.parseFromString(xmlString, "text/xml");
// transformăm înapoi din XML în șir
const xmlSerializer = new XMLSerializer();
const xmlString2 = xmlSerializer.serializeToString(xmlDOM);
console.log(xmlString2);

În final, vom obține înapoi șirul inițial xmlString.

Deoarece documentul html este de fapt și el un document xml, putem serializa în șir și o pagină web sau o parte din ea. De exemplu, transformăm în șir pagina web curentă:

const xmlSerializer = new XMLSerializer();
const htmlString = xmlSerializer.serializeToString(document);
console.log(htmlString);