JavaScript: Parse this string

function getBadgeCounts(s) {
 var badgeCountRE = /title="(\d+)/g, match = null, counts = [];
 while ((match = badgeCountRE.exec(s)) !== null) {
 counts.push(match[1]);
 }
 return {gold: counts[0], silver: counts[1], bronze: counts[2]};
}

Without hardcoded medal names:

function getBadgeCounts(s) {
 var badgeCountRE = /title="(\d+) (\w+)/g, match = null, counts = {};
 while ((match = badgeCountRE.exec(s)) !== null) {
 counts[match[2]] = match[1];
 }
 return counts;
}

This is what the string is:

 '<span title="5 gold badges">
 <span class="badge1">&#9679;</span>
 <span class="badgecount">5</span>
 </span>
 <span title="8 silver badges">
 <span class="badge2">&#9679;</span>
 <span class="badgecount">8</span>
 </span>
 <span title="57 bronze badges">
 <span class="badge3">&#9679;</span>
 <span class="badgecount">57</span>
 </span>'

Maybe you can add it to an unvisible div, so you can use DOM method to get the values you want

var str = "\u003cspan title=\"5 gold badges\"\u003e\u003cspan class=\"badge1\"\u003e●\u003c/span\u003e\u003cspan class=\"badgecount\"\u003e5\u003c/span\u003e\u003c/span\u003e\u003cspan title=\"8 silver badges\"\u003e\u003cspan class=\"badge2\"\u003e●\u003c/span\u003e\u003cspan class=\"badgecount\"\u003e8\u003c/span\u003e\u003c/span\u003e\u003cspan title=\"57 bronze badges\"\u003e\u003cspan class=\"badge3\"\u003e●\u003c/span\u003e\u003cspan class=\"badgecount\"\u003e57\u003c/span\u003e\u003c/span\u003e";

var res = {
 gold: 0,
 silver: 0,
 bronze: 0
};
/* using a RexExp
/ - delimeter
(\d+) - capturing one or more digits
\s+ - one or more whitespace characters
(gold|silver|bronze) - capturing the color
/g - delimeter (global flag)
to match the information in the title of the spans
and using the replace trick to populate res
*/
str.replace( /(\d+)\s+(gold|silver|bronze)/g, function( all, count, color ) {
 res[color] += parseInt( count );
});
console.log( res ); // Object { gold=5, silver=8, bronze=57}

If you put that string into a jQuery call, you can then query the document fragment just like you would any other piece of HTML:

var badgeHTML = "..." // Your encoded string here
var parsedHTML = $(badgeHTML); // Returns a jQuery collection of HTML nodes

• javascript
• html
• json
• text-parsing