Question

我有一个字符串s（HTML格式的文字段落），我使用它来将其包含在div中。

document.getElementById("mydiv").innerHTML = s;

s可能包含一些<a href="...">...</a>个链接。 如何自动将target="_blank"添加到这些链接？（如果用户点击它们，则不会替换当前页面）

我正在考虑使用某种正则表达式来检测s中的链接，检测是否已经存在target = _blank，如果没有，则添加它，但这看起来很复杂。在target=_blank之后将s插入DOM之后添加.innerHTML = s会更好吗？如果是这样，怎么样？

Answer 1

使用innerHTML添加锚点后，使用querySelectorAll()遍历所有锚点。然后将target属性设置为setAttribute()，如下所示：

document.querySelectorAll("#mydiv a").forEach(function(a){
  a.setAttribute('target', '_blank');
})

Answer 2

在DOM中插入s之后添加target = _blank会更好吗？在.innerHTML = s之后？如果是这样，怎么样？

执行innerHTML

之后

document.getElementById("mydiv").innerHTML = s;

迭代a内的所有链接myDiv并将此属性target设置为

var myDivEl = document.getElementById( "mydiv" ); //get the reference to myDiv element
var anchorsInMyDiv = myDivEl.querySelectorAll( "a" ); //get all the anchors in myDiv element
[ ...anchorsInMyDiv ].forEach( s => s.setAttribute( "target", "_blank" ) ); //iterate all the anchors and set the attribute

将target = _blank添加到HTML字符串中的每个链接

2 个答案: