Question

我有像这样的图像集

http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s640/camera-541213_1920.jpg
http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s500-p/camera-541213_1920.jpg
http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s320-w160/camera-541213_1920.jpg
http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s320/camera-541213_1920.jpg

你可以看到图像有s640，s500-p，s320-w160，它们指定了图像的高度和宽度。

我想使用像这样的正则表达式的帮助将图像url（s640，s500-p，s320-w160）替换为（s1600）

http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s1600/camera-541213_1920.jpg
http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s1600/camera-541213_1920.jpg
http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s1600/camera-541213_1920.jpg
http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s1600/camera-541213_1920.jpg

可以告诉我怎么能这样做

Answer 1

您可以在路径段上创建一个函数并拆分：

// path: The image url
// replacement: The replacement string
function replaceSize(path, replacement) {
    var parts = path.split('/'); // break the string to an array
    parts[7] = replacement;      // this is the path segment to replace
    return parts.join('/');      // glue the array back into a string
}
// Test the function
console.log(replaceSize('http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s640/camera-541213_1920.jpg', 's1600'));
// output: http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s1600/camera-541213_1920.jpg

Answer 2

使用JQuery：

<script type="text/javascript">
    $("img").each(function(key, val){
        var src = $(this).attr('src').replace(/s640|s500-p|s320-w160|s320/g, "s1600");
        $(this).attr('src', src);
    });
</script>

以下是完整代码：

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
</head>
<body>

    <img src="http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s640/camera-541213_1920.jpg" alt="" />
    <img src="http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s500-p/camera-541213_1920.jpg" alt="" />
    <img src="http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s320-w160/camera-541213_1920.jpg" alt="" />
    <img src="http://1.bp.blogspot.com/-swqrzpzvh7s/Vi6Os2n7NGI/AAAAAAAABRs/W9uC8EJldt0/s320/camera-541213_1920.jpg" alt="" />



    <script type="text/javascript">

        $("img").each(function(key, val){
            var src = $(this).attr('src').replace(/s640|s500-p|s320-w160|s320/g, "s1600");
            $(this).attr('src', src);
        });

    </script>

</body>
</html>

正则表达式替换Javascript中的图像URL

2 个答案: