javascript - 如何在js中循环执行replace

Question

我有一个这样的字符串

var string = '<img src="test.jpg'><img src="test2.jpg>';
var dom = new JSDOM(string,{ includeNodeLocations: true });
dom = dom.window.document.querySelectorAll("img");
for(var i = 0;i< dom.length;i++) {
    text = string.replace(/<img[^>]*>/g,'<amp-img layout="responsive" class="ampimageheight" src="'+dom[i].getAttribute('src')+'"  width="200" height= "100"></amp-img>');
 }

但是我的输出是

<amp-img layout="responsive" class="ampimageheight" src="test2.jpg"  width="200" height= "100"></amp-img><amp-img layout="responsive" class="ampimageheight" src="test2.jpg"  width="200" height= "100"></amp-img>

其中只有第二个图像 src 被替换为 2 个图像。我认为这是因为异步。任何人都可以帮助我。谢谢。

Answer 1

好吧，如果您在循环中运行replace，则不需要设置正则表达式的标志。因为它会在第一次循环时替换所有 img 。第一个循环之后什么都不做。因此，您可以删除 Regex 标志，或使用回调替换函数的第二个参数，如下所示。

text = string.replace(/<img[^>]*>/g, function(str, index){
return '<amp-img layout="responsive" class="ampimageheight" src="'+dom[index].getAttribute('src')+'"  width="200" height= "100"></amp-img>'
});

而且它不需要循环；