I have a HTML page full of data separated by mas and each row ends in a <br /> tag. In JavaScript I can get this from the DOM by asking for the innerHTML of the element containing the data.

My question is how to parse the innerHTML to get the data out from between the mas and start on the next line when it hits the <br /> tag?

You can probably ignore the rest as that is my question above.

When I parse each line I will start a new object and put the data into it. I'm just not sure what to do with the innerHTML!

I did put the data through a CSVtoarray function I found but ended up with an array of one large array instead of an array of arrays for each line. I can work my way through this array creating objects from the data along the way but turning the innerHTML into a single array seems an unnecessary step when I could parse the data straight into object.

The data is put there via AJAX. I can change the format that the data es in. As I said I have it separating data with mas and <br /> tag at the end of the line. I do not know if this is stupid or not.

I have a HTML page full of data separated by mas and each row ends in a <br /> tag. In JavaScript I can get this from the DOM by asking for the innerHTML of the element containing the data.

My question is how to parse the innerHTML to get the data out from between the mas and start on the next line when it hits the <br /> tag?

You can probably ignore the rest as that is my question above.

When I parse each line I will start a new object and put the data into it. I'm just not sure what to do with the innerHTML!

I did put the data through a CSVtoarray function I found but ended up with an array of one large array instead of an array of arrays for each line. I can work my way through this array creating objects from the data along the way but turning the innerHTML into a single array seems an unnecessary step when I could parse the data straight into object.

The data is put there via AJAX. I can change the format that the data es in. As I said I have it separating data with mas and <br /> tag at the end of the line. I do not know if this is stupid or not.

• javascript
• dom

• Just get a JSON object from your server. – josh3736 Commented May 10, 2012 at 17:14
• @josh3736 That's a very clean solution. Thanks for reading through and seeing through my stupidity. – Peter Bushnell Commented May 10, 2012 at 18:31

3 Answers 3

So, you want to csv-parse a file where newlines are indicated with <br /> instead of \n? Just use that separator in your CSV-Parser then. Simple version:

text.split("<br />".map(function(line){ return line.split(","); })

You could also split by regular expressions, like

text.split(/\s*<br ?\/>\s*/)...

If you really habe the CSV data in a DOM, you could remove all the br-element and use the remaining (text) nodes as the lines-array.

You mention that you have control over the data you're getting via AJAX, and you're right that your current approach is not the best idea. First off, you should never try to parse HTML on your own, even if you think it's "simple" – different browsers will give you different innerHTML for the exact same content. Instead, use the DOM to find the information you're looking for.

That said, the correct approach here is just to return a JSON object from the server; you'll then have direct access to your data. Nearly every server-side language has some kind of facility to output JSON, and JavaScript can parse the JSON string natively¹ with JSON.parse().

From the server, return:

{items: [
    { id: 0, name: '...' },
    { id: 1, name: '...' },
    ...
]}

On the client (assuming jQuery),

$.getJSON('/path-to-script/', function(d) {
    for (var i = 0; i < d.items.length; i++) {
        d.items[i].id;
    }
});

^{1 - in modern browsers}

You could simply do this if you just want to "get the data out from between the mas":

yourElem.innerHTML = yourElem.innerHTML.split(",").join(""); 

Or if you just want an array of lines:

var lines = yourElem.innerHTML.split(",");

That'll return an array of lines with <br> elements intact. It's not clear if that's what you want, though.