Как изменить строку img src с _m на _t, используя jquery для набора изображений

Я надеялся получить хороший толчок в правильном направлении, я хотел бы изменить окончание строки моих исходных изображений... надеюсь, я сформулировал это правильно.

Во всяком случае мои текущие src's читают:

<img src="something/something/12345_m.jpg" />

Я хотел бы изменить это на:

<img src="something/something/12345_t.jpg" />

Любая идея, ребята... Спасибо!

5 ответов

Решение

Это немного безопаснее:

$('img').each(function () {
    var src = $(this).attr('src');
    $(this).attr('src', src.replace(/_m(\.[^.]+)?$/, '_t$1');
});

В противном случае вы можете рисковать URL, как /bat_man/images/oh_my_god_m.png в конечном итоге как /bat_tan/images/oh_my_god_m.png при использовании ответа eKek0.


Объяснение регулярного выражения /_m(\.[^.]+)?$/:

  • /.../ просто границы шаблона.
  • _m соответствует буквальному _m,
  • (...) группировка совпадений, первый заканчивается как $1 в результате.
  • \. соответствует буквальному ., Так как . это специальный символ в регулярном выражении, он избежал \,
  • [...] представляет группу символов.
  • ^. соответствует всему, кроме буквального ., Поскольку это внутри группы, бежать не нужно.
  • + соответствует одному или нескольким символам.
  • ? предыдущая группа является необязательной (для случая, когда нет расширения файла).
  • $ совпадение должно происходить в конце строки (и, следовательно, не в середине или около того).
$(img).each(function () {
  var src = $(this).attr('src');
  $(this).attr('src', src.replace("_m", "_t");
});

Нет необходимости в jQuery на этом:

function argsToArray(args) {
  var r = []; for (var i = 0; i < args.length; i++)
    r.push(args[i]);
  return r;
}
argsToArray(document.getElementsByTagName('img')).forEach(function(img) {
  img.src = img.src.split('_m').join('_t');
});

img.src = "<image source>"; где img переменная ищется из DOM следующим образом: document.getElementByTagName('img')[0] или это: document.getElementById('image') (если <img id="image" />), узнать о HTML DOM, чтобы сделать это.

Я не проверял это, но это должно работать:

$('img').each(function () {
    var src = $(this).attr('src');
    $(this).attr('src', src.replace(/_m\.(png|jpg|jpeg|gif)$/, '_t.$1'));
});
Другие вопросы по тегам