Regex, jQuery, Replace, Function, String Manipulation, Templating

javascript string replace all
jquery string replace all
javascript string replace multiple
jquery regex replace
javascript replace all commas
javascript regex
replace all instances in string javascript
javascript replace all spaces

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>

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/

JavaScript String replace() Method, Note: If you are replacing a value (and not a regular expression), only the first instance of the value will be replaced. To replace all occurrences of a specified value  The replace () method searches a string for a specified value, or a regular expression, and returns a new string where the specified values are replaced. Note: If you are replacing a value (and not a regular expression ), only the first instance of the value will be replaced. To replace all occurrences of a specified value, use the global (g

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>

Basic JavaScript template engine using replace, match and RegExp , This form of regex accepts a string as the first argument and returns In the three functions, you're first using match to get the matches then  In JavaScript, regular expressions are often used with the two string methods: search () and replace (). The search () method uses an expression to search for a match, and returns the position of the match. The replace () method returns a modified string where the pattern is replaced. Using String search () With a String.

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>

How to Replace All Occurrences of a String in JavaScript, You can use the JavaScript replace() method in combination with the regular expression to find and replace all occurrences of a word or substring inside any  jQuery RegEx Examples to use with .match() This is a reference post for some common RegExp ( regular expressions ) selectors that can be used with the jQuery.match() function.

Template String Replacement Function · MattSnider.com, Today's article introduces an efficient method for replacing template values To inject values into a string we use the replace function of the String with a regular expression matching the template The first value of the callback function is the matched substring, and all we JavaScript JS Documentation  replace searches a given string for another given substring, and replaces each occurrence with a given replacement string. replace ( string , substring , replacement ) If substring is wrapped in forward slashes, it is treated as a regular expression, using the same pattern syntax as regex .

Using String Replace in JavaScript, Exploring different ways to use String#replace in JavaScript. This method allows you to pass a regular expression (or a string that regular expression (​that is, with the g flag), so clearly JS only applies the expression in a single context. some ecommerce page template template.replace( /(<span id=")(. The only piece missing is having the interface description in the title as so far I'm just using a variable with the interface name. If I could just drop everything after the first space in the variable. The full string will be: (Ethernet3/1 Alias myinterfacedescription). I can use "Interface ${ifalias regex manipulation}|: Bits received"

How To Replace All Occurrences Of A Word In A JavaScript String , Latest · tutorials · scripts · templates · graphics · audio If we specify the first argument as string, the replace function only The same can be re-written using a regular expression as the first argument, like so: The JavaScript split function splits a string into an array based on a Site Switcher (jQuery). String methods help you to work with strings. Primitive values, like "John Doe", cannot have properties or methods (because they are not objects). But with JavaScript, methods and properties are also available to primitive values, because JavaScript treats primitive values as objects when executing methods and properties.

Comments
  • What's your question?
  • Can you help refactoring parseEntry() function to return expected output?
  • What does it return, if not the "expected output"? Do you have any errors?
  • Not sure why, but the regex '\d+' gets the slash removed, a bit confused on the regex stack...
  • (Thanks for adding snippet, didn`t even know you could do this on StackOverflow o_O)