Question

我在这里使用这段很好的代码用旧版浏览器中的.png替换所有.svg文件，非常适合向后兼容。

然而，今天一直在使用shopify，出于一些奇妙的原因，它在CDN提取的每一项资产的末尾增加了一个强大的查询。

function supportsSVG() {
    return !! document.createElementNS && !! document.createElementNS('http://www.w3.org/2000/svg','svg').createSVGRect;
}

if (!supportsSVG()) {
    var imgs = document.getElementsByTagName('img');
    var dotSVG = /.*\svg$/;
    for (var i = 0; i !== imgs.length; ++i) {
        if(imgs[i].src.match(dotSVG)) {
            imgs[i].src = imgs[i].src.slice(0, -8) + 'png';
        }
    }
}

现在，目标是在最后使用.svg。但我无法弄清楚如何定位.svg？1234并用.png替换svg

任何人都知道目标的正则表达式吗？

Answer 1

即使域名是.svg或URL中有任何其他.svg，这也有效。需要最后的.svg

var url = "http://tricky.href.svg/filename.svg?abc1?test2?test3";
url = url.replace(/\.(svg)($|\?)/, '.png$2');
console.log(url); // http://tricky.href.svg/filename.png?abc1?test2?test3

你可以像这样使用它：

var dotSVG = /\.(svg)($|\?)/;
for (var i = 0; i !== imgs.length; ++i) {
    imgs[i].src = imgs[i].src.replace(dotSVG, '.png$2');
}

如果URL后面有Querystring，请使用javascript更改文件扩展名

1 个答案: