web-dev-qa-db-fra.com

Javascript - Remplacer html en utilisant innerHTML

J'essaie de remplacer le html en utilisant le javascript innerHTML.

De:

aaaaaa/cat/bbbbbb

À:

<a href="http://www.google.com/cat/world">Helloworld</a>

C'est mon 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=\"http://www.google.com/') ;
strMessage1.innerHTML = strMessage1.innerHTML.replace( /.bbbbbb/g,'/world\">Helloworld</a>') ;
</script>
</body>
</html>

Lorsque j'exécute ce code, il disparaît l'hyperlien Helloworld. ce que je fais mal. Veuillez aider.

Je vous remercie pour votre aide.

javascriptinnerhtml
9
Dexter

Vous devez enchaîner le replace () au lieu d'attribuer le résultat et de le remplacer à nouveau.

var strMessage1 = document.getElementById("element1") ;
strMessage1.innerHTML = strMessage1.innerHTML
                        .replace(/aaaaaa./g,'<a href=\"http://www.google.com/')
                        .replace(/.bbbbbb/g,'/world\">Helloworld</a>');

Voir DÉMO .

13
Antony

Vous remplacez la balise de départ puis la remettez dans innerHTML, donc le code sera invalide. Effectuez tous les remplacements avant de remettre le code dans l'élément:

var html = strMessage1.innerHTML;
html = html.replace( /aaaaaa./g,'<a href=\"http://www.google.com/');
html = html.replace( /.bbbbbb/g,'/world\">Helloworld</a>');
strMessage1.innerHTML = html;
2
Guffa