how to retrieve specific element from xml file and return its node using javascript

Question

how to retrieve data from xml in javascript.

data.xml

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<Lexical-Entry>
    <Synset>
        <Word val="aare"/>
        <SynsetRelation>
            <Relation att="iof" hypernym="thing" val="river"/>
        </SynsetRelation>
        <ID WordnetId="09186064" uw_id="1"/>
    </Synset>
    <Synset>
        <Word val="aarhus"/>
        <SynsetRelation>
            <Relation att="iof" hypernym="thing" val="city"/>
            <Relation att="equ" val="arhus"/>
        </SynsetRelation>
        <ID WordnetId="08762104" uw_id="2"/>
    </Synset>
    <Synset>
        <Word val="aaron"/>
        <SynsetRelation>
            <Relation att="icl" hypernym="abstract_thing" val="name"/>
            <Relation att="com" val="male"/>
            <Relation att="nam" val="person"/>
        </SynsetRelation>
        <ID WordnetId="0" uw_id="3"/>
    </Synset>
</Lexical-Entry>

test.html

<html>
<body>
    <div>
                <h1>Search Word</h1>
                <br/>
                <input type="text" name="SearchValue" placeholder="Enter a word" />
                <br/>
                <br/>
                <input type="submit"  value="Search"/>
            </div>

</body>
</html>

when user enters a word to search for ex:aaron it should retrieve values of aaron synset. and when user enters word it should search that word in data.xml and then retrieves values of aaron synset.

Have you checked out [this thread](http://stackoverflow.com/questions/7083341/is-there-a-way-to-getelement-xml-by-attribute)? It might answer your question. — Asagnome, Mar 23 '17 at 08:48
@Asagnome yes i checked it out but it was not that much that i required. i require the complete node when user searches a word aaron and that node should be stored so that i can access its child values. — Nishita, Mar 23 '17 at 09:27

score 0 · Answer 1 · answered Mar 23 '17 at 09:06

0

Not fully understood your question, but this code extracts Synset element from xml string where Name node value is aaron.

It should give you idea how to fetch what you need. If no, when post more code about how and what you are trying to achieve.

var xml = '<?xml version="1.0" encoding="UTF-8" standalone="no"?><Lexical-Entry><Synset><Word val="aare"/><SynsetRelation><Relation att="iof" hypernym="thing" val="river"/></SynsetRelation><ID WordnetId="09186064" uw_id="1"/></Synset><Synset><Word val="aarhus"/><SynsetRelation><Relation att="iof" hypernym="thing" val="city"/><Relation att="equ" val="arhus"/></SynsetRelation><ID WordnetId="08762104" uw_id="2"/></Synset><Synset><Word val="aaron"/><SynsetRelation><Relation att="icl" hypernym="abstract_thing" val="name"/><Relation att="com" val="male"/><Relation att="nam" val="person"/></SynsetRelation><ID WordnetId="0" uw_id="3"/></Synset></Lexical-Entry>'

var parsedXml = (new window.DOMParser()).parseFromString(xml, 'text/xml')
var valueToLookFor = 'aaron';
var node = parsedXml.querySelector('Word[val="' + valueToLookFor +'"]').parentNode

answered Mar 23 '17 at 09:06

Mantas Čekanauskas

2,218
6
23
43

instead of using xml content within variable how to extract it from xml file .? – Nishita Mar 23 '17 at 09:23
just use `XMLHttpRequest` or `$.ajax` as in here http://stackoverflow.com/questions/12085181/reading-xml-file-using-javascript – Mantas Čekanauskas Mar 23 '17 at 09:53
can you help me out how to use d3.js with it for loading external xml file ? – Nishita Mar 23 '17 at 10:48
I'm not very familiar with d3.js, but you can get file from server to browser using `$.ajax` like I mentioned in previous comment. – Mantas Čekanauskas Mar 23 '17 at 11:02
can you provide me a snippet for it.? i tried using ajax i m not able to get it. – Nishita Mar 23 '17 at 11:20
$.ajax({ type: "GET", url: "read2.xml", dataType: "xml", success: function(xml) { $(xml).find('site').each(function(){ //this is the file content. Do what you need to do }); } }); – Mantas Čekanauskas Mar 23 '17 at 11:25

score 0 · Answer 2 · edited May 23 '17 at 12:25

If you reuse the code of this thread, you can achieve it.

You get the parent node of the <Word val="aaron"/>.

The code below is ugly since the original one was. So I recommand you to completely redo your own but you have the idea.

Array.prototype.where = function(matcher) {
    var result = [];
    for (var i = 0; i < this.length; i++) {
        if (matcher(this[i])) {
            result.push(this[i]);
        }
    }
    return result;
};

function getElementsByAttribute(tag, attr, attrValue) {
    //Get elements and convert to array
    var elems = Array.prototype.slice.call(document.getElementsByTagName(tag), 0);
    
    //Matches an element by its attribute and attribute value
    var matcher = function(el) {
        return el.getAttribute(attr) == attrValue;
    };

    return elems.where(matcher);
}

var elems = getElementsByAttribute('Word', 'val', 'aaron');
for(var i = 0; i < elems.length; i++) {
  console.log(elems[i].parentNode);
  // !!! HERE IS YOUR XML NODE -> elems[i] !!!
}

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<Lexical-Entry>
    <Synset>
        <Word val="aare"/>
        <SynsetRelation>
            <Relation att="iof" hypernym="thing" val="river"/>
        </SynsetRelation>
        <ID WordnetId="09186064" uw_id="1"/>
    </Synset>
    <Synset>
        <Word val="aarhus"/>
        <SynsetRelation>
            <Relation att="iof" hypernym="thing" val="city"/>
            <Relation att="equ" val="arhus"/>
        </SynsetRelation>
        <ID WordnetId="08762104" uw_id="2"/>
    </Synset>
    <Synset>
        <Word val="aaron"/>
        <SynsetRelation>
            <Relation att="icl" hypernym="abstract_thing" val="name"/>
            <Relation att="com" val="male"/>
            <Relation att="nam" val="person"/>
        </SynsetRelation>
        <ID WordnetId="0" uw_id="3"/>
    </Synset>
</Lexical-Entry>

how can i fetch data from external xml file and then how can i access — Nishita, Mar 23 '17 at 10:46
So like here http://stackoverflow.com/questions/10684145/how-to-retrieve-xml-data-from-javascript ? It uses **XHR**: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest . The doc is well done, with examples and you don't have to use jQuery (and so ajax). — Asagnome, Mar 23 '17 at 11:36

how to retrieve specific element from xml file and return its node using javascript

2 Answers2