javascript to replace a text within [] with hyperlink - javascript

Am in a process of writing a javascript to replace a text within [] to a html link. But am stuck at generating a regular expression to match any string that is in [] and then replace it with a hyperlink.
Below is my code snippet that i have tried:
<html>
<head>
</head>
<body id="body">
Hello World [1234]<br>
[322]<br>
Hello
</body>
</html>
<script type="text/javascript">
var bodyText=document.getElementById('body').innerHTML;
var pattern = "\[(.*?)\]";
var replaceText = "Pradeep";
document.getElementById('body').innerHTML = bodyText.replace(pattern/gi, replaceText);
</script>
Can anyone please suggest me a best way to do it
Thanks,

If you have a string representing a regexp, you have to call new RegExp(str) to build a regexp from it, but you can just make a regexp literal here. Also, the i flag is not necessary since nothing in your regexp refers to letters. And, you don't use the capturing groups so you can eliminate them as well. Lastly, you need to escape the quotes in the string because the interpreter now thinks your strings ends after href=:
var bodyText = document.getElementById('body').innerHTML;
var pattern = /\[.*?\]/g;
var replaceText = "Pradeep";
document.getElementById('body').innerHTML = bodyText.replace(pattern, replaceText);

I tried \[[^\]]+\] as regexp and got the right output:
var s = 'Hello World [1234]<br>[322]<br>';
s = s.replace(/\[[^\]]+\]/ig, 'Pradeep');
// output
// Hello World Pradeep<br>Pradeep<br>

Related

Javascript replace first letter of every string?

I am trying to make a script that should replace strings. This is what my current replace function does:
let message2 = message1.replace(/hello/g, "[size=medium]h[/size]ello");
As you can see, this adds the size=medium tag to the h of the word. This works good, but I want this to work in every possible capitalization and still remain in that capitalization.
For example:
"hELLo" should be replaced with "[size=medium]h[/size]ELLo"
and
"HELLo" be replaced with "[size=medium]H[/size]ELLo"
Only the h/H should be wrapped in the tag, but I am not sure how to perform something like this. Big thanks for any input on this!
You can use capture groups:
message1.replace(/(h)(ello)/ig, "[size=medium]$1[/size]$2")
Or alternatively, look-ahead:
message1.replace(/h(?=ello)/ig, "[size=medium]$&[/size]")
You can try this regex:
var a = 'hello';
var b = 'HEllo';
console.log(a.replace(/^h/i, "[size=medium]$&[/size]"))
console.log(b.replace(/^h/i, "[size=medium]$&[/size]"))
Of if you just want to replace h in hello, you can use look ahead:
var a = 'HEllo';
var b = 'Halo';
console.log(a.replace(/^h(?=ello)/i, "[size=medium]$&[/size]"))
console.log(b.replace(/^h(?=ello)/i, "[size=medium]$&[/size]"))

Match everything inside body tags with regex and javascript

I'd like to know if someone can help me with regex on javascript.
So basically I have the following sample of an email body:
<body lang="FR" link="#0563C1" vlink="#954F72"><div class="WordSection1"><p style="margin:0cm;margin-bottom:.0001pt">Bonjour,<o:p></o:p></p></div></body>
And using regex I need to get only the content between the body tag, how can I do that?
I tried this before (str is the html code above): str.match(/<body\s[^>]*>(.*?)<\/body>/gi);
But when I try to get the group 1, using str[1], I always get undefined, any idea why?
Important Note: I'm doing this on ServiceNow and I need to parse the HTML on server side, basically what I have is the HTML code inside a string field.
You can use DOMParser.
var parser = new DOMParser();
var doc = parser.parseFromString(str, "text/html");
var body = doc.getElementsByTagName('body')[0].innerHTML;
console.log(body);
Look this question How do you access the matched groups in a JavaScript regular expression?
This should work
var str = '<body lang="FR" link="#0563C1" vlink="#954F72"><div class="WordSection1"><p style="margin:0cm;margin-bottom:.0001pt">Bonjour,<o:p></o:p></p></div></body>'
var myregex = /<body\s[^>]*>(.*?)<\/body>/gi
var match = myregex.exec(str)
console.log(match[1])

Javascript replace text within <title> with <span>title</span>

Hi i want to replace my javascript string solution like this.
input:- this is <title> and <heading>
output:- this is <span>title</span> and <span>heading</span>
can anyone help me on this.
Thanks in advance.
use regex to replace
input.replace(/</g, '<span_').replace(/>/g,'</span>').replace(/_/g,'>');
Try something like this:
var input = "this is <title> and <heading>";
var output = input.replace(/<([^>]+)>/g, "<span>$1</span>");
console.log(output);
That is, match an opening <, followed by one or more non-> characters captured as a submatch so that you can reference it as $1 in the replacement string, followed by a closing >.
Another alternative
var output = input.split("<").join("#").split(">").join("</span>").split("#").join("<span>");
console.log(output);
Use
input.replace(/<[a-zA-Z]*>/g, '<span>$&</span>');
Explanation:
.replace encloses all tags in ''. '$& is replaced with the tag. See this for more info: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace
Example:
var ta = document.getElementById('ta'), output = document.getElementById('output');
ta.value = 'I have <title> and <head> (this is just example text, you can replace).';
function replaceIt() {
output.innerText = ta.value.replace(/<[a-zA-Z]*>/g, '<span>$&</span>');
// Okay, technically Node#innerText is non-standard, so use an HTML escape function on production sites.
// For demo purposes, I just chose innerText for ease of use
}
<textarea id="ta"></textarea>
<button onclick="replaceIt()">Enclose tags in &ltspan&gt s.</button>
<div>Output:</div>
<div id="output"></div>

Unescaping RegEx Characters in JavaScript

I'm trying to make a programming language that takes the input code, which uses String.replace to slowly translate bits of the new language into JavaScript, adding regex escapes. However, when I finally print out what I have at the end, it keeps the escapes, and will totally mess up the translated code. Here is what I have now:
<!DOCTYPE html>
<html>
<head>
<title>Translating</title>
</head>
<body>
<script type="text/javascript">
function escapeRegExp(str) {
return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
}
var infile = "{{ }}";
infile = escapeRegExp(infile);
infile = infile.replace("[", "{");
infile = infile.replace("]", "}");
document.write(infile);
</script>
</body>
</html>
The escapeRegExp is the function I'm using to escape the code in the first place. The infile variable will probably be filled by PHP when I am finished, but for now it just has test code.
I thought of a very simple way to fix this: just use infile = infile.replace(/\\/g, ""); and it will replace all backslashes with null strings.

How to get regex to match multiple script tags?

I'm trying to return the contents of any tags in a body of text. I'm currently using the following expression, but it only captures the contents of the first tag and ignores any others after that.
Here's a sample of the html:
<script type="text/javascript">
alert('1');
</script>
<div>Test</div>
<script type="text/javascript">
alert('2');
</script>
My regex looks like this:
//scripttext contains the sample
re = /<script\b[^>]*>([\s\S]*?)<\/script>/gm;
var scripts = re.exec(scripttext);
When I run this on IE6, it returns 2 matches. The first containing the full tag, the 2nd containing alert('1').
When I run it on http://www.pagecolumn.com/tool/regtest.htm it gives me 2 results, each containing the script tags only.
The "problem" here is in how exec works. It matches only first occurrence, but stores current index (i.e. caret position) in lastIndex property of a regex. To get all matches simply apply regex to the string until it fails to match (this is a pretty common way to do it):
var scripttext = ' <script type="text/javascript">\nalert(\'1\');\n</script>\n\n<div>Test</div>\n\n<script type="text/javascript">\nalert(\'2\');\n</script>';
var re = /<script\b[^>]*>([\s\S]*?)<\/script>/gm;
var match;
while (match = re.exec(scripttext)) {
// full match is in match[0], whereas captured groups are in ...[1], ...[2], etc.
console.log(match[1]);
}
Don't use regular expressions for parsing HTML. HTML is not a regular language. Use the power of the DOM. This is much easier, because it is the right tool.
var scripts = document.getElementsByTagName('script');
Try using the global flag:
document.body.innerHTML.match(/<script.*?>([\s\S]*?)<\/script>/gmi)
Edit: added multiple line and case insensitive flags (for obvious reasons).
The first group contains the content of the tags.
Edit: Don't you have to surround the regex-satement with quotes? Like:
re = "/<script\b[^>]*>([\s\S]*?)<\/script>/gm";
In .Net, there's a submatch method, in PHP, preg_match_all, which should solve you problem. In Javascript there isn't such a method. But you can made by yourself.
Test in
http://www.pagecolumn.com/tool/regtest.htm
Select $1elements method will return what you want
try this
for each(var x in document.getElementsByTagName('script');
if (x && x.innerHTML){
var yourRegex = /http:\/\/\.*\.com/g;
var matches = yourRegex.exec(x.innerHTML);
if (matches){
your code
}}

Categories

Resources