JavaScript - 使用innerHTML替换HTML

Question

JavaScript - 使用innerHTML替换HTML

18

我正在尝试使用JavaScript的innerHTML替换HTML。

来自：

aaaaaa/cat/bbbbbb

收件人：

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

这是我的代码

<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>

当我运行这段代码时，它会使 Helloworld 的超链接消失。我做错了什么，请帮忙。

谢谢你的所有帮助。

- Dexter

2个回答

5

您正在替换起始标签，然后将其放回到innerHTML中，因此代码将无效。在将代码放回元素之前进行所有替换：

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;

- Guffa

1

这对我也有效，但会破坏放置位置后面的页面。 - M21

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Antony · Accepted Answer

你应该将replace()链接在一起，而不是分配结果并再次替换。

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

请查看演示。