用javascript替换文件名的一部分答案

【问题标题】：Replace part of filename with javascript用javascript替换文件名的一部分
【发布时间】：2014-05-30 13:11:31
【问题描述】：

我想根据屏幕大小加载不同的图像，并认为用 javascript 替换文件名中的文本会很优雅，只要我已经正确命名了相应的图像。我很接近这个，但 close 不会削减它。

Javascript：

if ($(window).width() > 960) {
    $("div:contains(_small.jpg)").html(function (i, currentVal) {
        return currentVal.replace("_small.jpg", "_large.jpg");
    });
}

HTML：

<img src="...test-image_small.jpg" />

正如您在我的小提琴中看到的，我已经让它在文本上工作，但不是文件名。

ps - 我特别不想在媒体查询类中加载图像作为背景图像。

【问题讨论】：

标签： javascript image responsive-design

【解决方案1】：

功能齐全：

if ($(window).width() > 960) {
    $("img[src$='_small.jpg']").each(function() {
        var new_src = $(this).attr("src").replace('_small', '_large'); 
        $(this).attr("src", new_src); 
    }); 

} else {
    alert('Less than 960');
}

【讨论】：

【解决方案2】：

我想根据屏幕尺寸加载图片

将div 的CSS 的width 和height 设置为100%

CSS

div {
    width: 100%;
    height: 100%;   
}

JSFiddle

【讨论】：

不同的图像用于不同的屏幕尺寸。我会更新问题以澄清