使用子字符串在 javascript 中剪切并重新构造字符串

Question

我在逻辑上苦苦挣扎...假设我有这个字符串：

var s = '<span>foo bar</span><img src="www.foo.bar"><img src="www.blah.blah">
<span>blah blah blah</span>';

我想做的是剪掉每个图像的来源，并在没有图像来源的情况下重建 "s" 字符串。这是我到目前为止所拥有的，但它是错误的...

numImgs = s.match(/<img/gi).length;
    if (numImgs > 0) {
        var imgSrc, startSrc = 0, endSrc = 0;
        for (var i = 0; i < numImgs; i++) {
            (function() {
                startSrc = s.indexOf('<img src="', endSrc);
                endSrc = s.indexOf('"', startSrc + 10);
                imgSrc = s.substring(startSrc+10, endSrc);
                s = s.substring(0, startSrc+10) + s.substring(endSrc, s.length);
                console.log("start: " + startSrc + " end: " + endSrc + "\n" + s);
            })(i);
        }
    }

我知道我不能使用 s.indexOf('<img src="', endSrc) 作为开始，因为第二次 "s" 字符串已经改变并且 endSrc 已经偏离了。我怎样才能实现我在这里想要做的事情，获得第二个、第三个、第四个img?

结果将是：

var s = '<span>foo bar</span><img src=""><img src=""><span>blah blah blah</span>';

解决方案：这可能是一种非常肮脏的方法，但对于我所拥有的，我添加了 startSrc = s.indexOf('<img src="data');，因此它会找到第一个不为空的 src。

Answer 1

var s = '<span>foo bar</span><img src="www.foo.bar"><img src="www.blah.blah"><span>blah blah blah</span>';

var srcArray = [];
var result = s.match(/(<img).+?(>)/gi);

for(var i = 0; i < result.length; i++){
    var src = result[i].match(/src=\"(.+?)\"/);
    srcArray.push(src[1]);    
}
s = s.replace(/(<img).+?(>)/gi,'<img src=""/>');
console.log(srcArray, s); //["www.foo.bar", "www.blah.blah"] "<span>foo bar</span><img src=""/><img src=""/><span>blah blah blah</span>"

使用子字符串在 javascript 中剪切并重新构造字符串

Cutting out and re-constructing string in javascript with substring

javascript

string

substring