Javascript - best way to parse custom tags [duplicate]

Question

I wrote an API that returns the following

 <location><lat>41.47033705</lat><lon>-81.93612862</lon></location>
 <location><lat>41.470320224762</lat><lon>-81.9364535808563</lon></location>
 <location><lat>41.4704650640488</lat><lon>-81.9449239969254</lon></location>
 <location><lat>41.4780235290527</lat><lon>-81.8454140424728</lon></location>
 <location><lat>41.48597253</lat><lon>-81.82579113</lon></location>

I have an AJAX call that gets this and now I need to use it in my JavaScript.

Ultimately I would like and 2d Array [lat,lon]

What is the least amount of code to do this?

This is why I didn't try it stackoverflow.com/questions/1732348/… — DotNetRussell
– DotNetRussell, Commented Aug 20, 2013 at 0:50
@abc123 for this example assume that this is just JavaScript and Ajax. — DotNetRussell
– DotNetRussell, Commented Aug 20, 2013 at 0:52
@AMR Your XML is well defined, so it's safe to perform a regex. — Šime Vidas
– Šime Vidas, Commented Aug 20, 2013 at 0:54

McGarnagle · Accepted Answer · 2013-08-20 00:53:34Z

2

Assuming the response is valid XML, you can use getElementsByTagName and push to an array:

var arr = [];
for (var location in response.getElementsByTagName('location'))
{
    arr.push([
        parseFloat(location.getElementsByTagName('lat')[0]), 
        parseFloat(location.getElementsByTagName('lon')[0])
    ]);
}

answered Aug 20, 2013 at 0:53

McGarnagle

103k31 gold badges235 silver badges264 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

DotNetRussell Over a year ago

This is all custom tags that I have created. It will be standard and never very so will this still work?

Musa Over a year ago

Without a root tag it isn't valid XML.

McGarnagle Over a year ago

@AMR -- yes, that's fine. Javascript can work using the DOM on a schemaless XML document returned via Ajax.

DotNetRussell Over a year ago

@McGarnagle btw you just blew my mind addings things to array with no size....

Comfortably Numb · Accepted Answer · 2013-08-20 00:50:42Z

1

You can make your AJAX call via XmlHttmlRequest and get responseXML. Then you can parse your data via XmlDocument method and properties.

You can even run Xpath queries on the result to select exactly what you need.

answered Aug 20, 2013 at 0:50

Comfortably Numb

39.9k17 gold badges82 silver badges147 bronze badges

Comments

kirushanths · Accepted Answer · 2013-08-20 00:54:04Z

1

Just use JQuery's selector engine to parse your code.

Wrap your elements in a <div id="data"> ... </data> for easy selection and you can do the following:

var _locations = $('#data').find('location');
var my_data = [];

$.each(_locations, function(index, loc) {
    var _lat = $(loc).find('lat');
    var _lon = $(loc).find('lon');

    my_data.push([_lat.text(), _lon.text()]);
})

// my_data will contain a 2D array of your lat, lon

GoodLuck

-Kiru

answered Aug 20, 2013 at 0:54

kirushanths

1311 silver badge9 bronze badges

1 Comment

abc123 Over a year ago

user states no jquery...

abc123 · Accepted Answer · 2021-12-13 18:05:26Z

Regex 101 Demo

Regex

<lat>([^<]+)<\/lat><lon>([^<]+)<\/lon>

using g (global) flag

Description

<lat> Literal <lat>
1st Capturing group ([^<]+) 
    Negated char class [^<] 1 to infinite times [greedy] matches any character except:
        < The character <
<\/lat><lon> Literal </lat><lon>
2nd Capturing group ([^<]+) 
    Negated char class [^<] 1 to infinite times [greedy] matches any character except:
        < The character <
<\/lon> Literal </lon>

g modifier: global. All matches (don't return on first match)

Visualization

Regular expression visualization

Taking the above to solve your specific issue

DEMO jsFiddle

JS

var text = " <location><lat>41.47033705</lat><lon>-81.93612862</lon></location><location><lat>41.470320224762</lat><lon>-81.9364535808563</lon></location><location><lat>41.4704650640488</lat><lon>-81.9449239969254</lon></location><location><lat>41.4780235290527</lat><lon>-81.8454140424728</lon></location><location><lat>41.48597253</lat><lon>-81.82579113</lon></location>";

var myregexp = /<lat>([^<]+)<\/lat><lon>([^<]+)<\/lon>/g;
var results = new Array();
var match = myregexp.exec(text);
while (match != null) {
    var result = new Array();
    for (var i = 1; i < match.length; i++) {
        result.push(match[i]);
    }
    results.push(result);
    match = myregexp.exec(text);
}

console.log(results);

the variable results contains a 2d array [lat, lon]

Collectives™ on Stack Overflow

Javascript - best way to parse custom tags [duplicate]

4 Answers 4

4 Comments

Comments

1 Comment

Regex 101 Demo

Taking the above to solve your specific issue

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

4 Comments

Comments

1 Comment

Taking the above to solve your specific issue

Comments

Linked

Related