Javascript - Replace Html Using innerHTML
I'm Trying to Replace Html Using innerHTML Javascript. from: Aaaaaa/Cat/Bbbbbb to: Helloworld This's My Code Aaaaaa/Cat/Bbbbbb Var strMessage1 = Document...
I'm trying to replace html using innerHTML javascript.
From:
aaaaaa/cat/bbbbbb
To:
<a href="">Helloworld</a>
This's my code
<html>
<head>
</head>
<body>
<p id="element1">aaaaaa/cat/bbbbbb</p>
<script language="javascript">
var strMessage1 = document.getElementById("element1") ;
strMessage1.innerHTML = strMessage1.innerHTML.replace( /aaaaaa./g,'<a href=\") ;
strMessage1.innerHTML = strMessage1.innerHTML.replace( /.bbbbbb/g,'/world\">Helloworld</a>') ;
</script>
</body>
</html>
When i run this code it disappears Helloworld hyperlink. what I'm doing wrong. Please help.
Thank you for all your help.
2 Answers
You should chain the replace() together instead of assigning the result and replacing again.
var strMessage1 = document.getElementById("element1") ;
strMessage1.innerHTML = strMessage1.innerHTML
.replace(/aaaaaa./g,'<a href=\")
.replace(/.bbbbbb/g,'/world\">Helloworld</a>');
See DEMO.
You are replacing the starting tag and then putting that back in innerHTML, so the code will be invalid. Make all the replacements before you put the code back in the element:
var html = strMessage1.innerHTML;
html = html.replace( /aaaaaa./g,'<a href=\");
html = html.replace( /.bbbbbb/g,'/world\">Helloworld</a>');
strMessage1.innerHTML = html;