I have the following function:
function parseEntry(query, html, url) { // logic draft :( var re = new RegExp('{{{(.*)}}}'); regex = query.replace(re, "$1"); var newre = new RegExp(regex); regged = html.replace(newre, "$1"); ret = query.replace(regex, regged); // parse selectors var re = new RegExp('{{(.*)}}'); newtext = html.replace(re, "$1"); ret = ret.replace(newtext, $(newtext).clone().html()); // parse %url% ret = ret.replace("%url%", url); // ret remaining return ret; } // Called this way: let output = parseEntry('static value %url% {{.thisclass}} {{{(\d+)}}}', '<h1 class="thisclass">Test</h1><h2 class="thisclass">Test2</h2> 1234 12', "http://perdu.com"); console.log(output) /** should return: static value http://perdu.com TestTest2 123412 {{{triple brackets = regex}}} {{double brackets = jquery}} **/<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>Can you help refactoring parseEntry() function to return expected output?
All help appreciated!
3 Answers
Answers 1
I'm not sure if I undersand, but this is an attempt using different approaches I think are useful in this kind of situations. There are examples of split(), replace() and the createElement hack to parse html.
var query = 'static value %url% {{.thisclass}} {{{(\d+)}}}'; var html = '<h1 class="thisclass">Test</h1><h2 class="thisclass">Test2</h2> 1234 12'; var url = "http://perdu.com"; query = query.split(" ").map(o=>{ return o.replace(/\{\{\{(.*)\}\}\}/g, "$1"); }).map(o=>{ return o.replace(/\{\{(.*)\}\}/g, "$1"); }); var el = document.createElement( 'div' ); el.innerHTML = "<div class='outer'>"+html+"</div>"; var t1 = $("h1").text(); var t2 = $("h2").text(); var out = $(".outer").text(); var newArr = []; newArr.push(query[0]+" "+query[1]+" "+url+" "+t1+t2+out); newArr.push("{{{triple brackets = "+query[4]+"}}}"); newArr.push("{{double brackets = "+query[3]+"}}"); console.log(newArr); newArr.map(o=>{ $("#res").append(o+"<br>"); }); Full example here: http://jsfiddle.net/k8em5twd/6/
Answers 2
So if this question is as simple as "why didn't the backslash show up in my output", then the answer is also very simple. Try escaping the backslash in your input string like so:
let output = parseEntry('static value %url% {{.thisclass}} {{{(\\d+)}}}', '<h1 class="thisclass">Test</h1><h2 class="thisclass">Test2</h2> 1234 12', "http://perdu.com"); The key is that {{{(\d+)}}} becomes {{{(\\d+)}}}. This way the slash is recognized as a character. Otherwise, \d is treated as an escape sequence. Output below.
function parseEntry(query, html, url) { // logic draft :( var re = new RegExp('{{{(.*)}}}'); regex = query.replace(re, "$1"); var newre = new RegExp(regex); regged = html.replace(newre, "$1"); ret = query.replace(regex, regged); // parse selectors var re = new RegExp('{{(.*)}}'); newtext = html.replace(re, "$1"); ret = ret.replace(newtext, $(newtext).clone().html()); // parse %url% ret = ret.replace("%url%", url); // ret remaining return ret; } // Called this way: // THIS LINE IS CHANGED: let output = parseEntry('static value %url% {{.thisclass}} {{{(\\d+)}}}', '<h1 class="thisclass">Test</h1><h2 class="thisclass">Test2</h2> 1234 12', "http://perdu.com"); console.log(output) /** should return: static value http://perdu.com TestTest2 123412 {{{triple brackets = regex}}} {{double brackets = jquery}} **/<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>Answers 3
Ended up doing it myself, for the curious:
function parseEntry(query, url, ht) { // parse regex expressions (triple brackets) var re = new RegExp('{{{(.*)}}}', 'g'); q = query.match(re); for (qq in q) { var newregex = q[qq].replace("{{{", '').replace("}}}", ''); newregex = new RegExp(newregex, 'g'); newq = ht.match(newregex).join(""); query = query.replace(q[qq], newq); } // parse jquery expressions (double brackets) re = new RegExp('{{(.*)}}', 'g'); q = query.match(re); for (qq in q) { var newjq = q[qq].replace("{{", '').replace("}}", ''); code = $('<div>'+ht+'</div>').find(newjq); appendHTML = ''; code.each(function() { appendHTML += $(this).html(); }) query = query.replace(q[qq], appendHTML); } // parse %url% ret = query.replace("%url%", url); // ret remaining return ret; } let output = parseEntry('static value %url% {{.thisclass}} {{{(\\d+)}}}', "http://perdu.com", '<h1 class="thisclass">Test</h1><h2 class="thisclass">Test2</h2> 1234 12'); console.log(output);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
0 comments:
Post a Comment