Проблема с .replace () - работает только с первым соответствующим символом?

Question

Я пытаюсь добавить функцию в своем скрипте jQuery, которая создает полный путь src для img на основе его атрибута alt. Идея состоит в том, чтобы сделать код настолько тонким, насколько это возможно, чтобы неучастники, которые его обрабатывают, ничего не сломали; все, что им нужно было бы сделать, это получить правильный атрибут alt, а оставшаяся часть пути автоматически создается сценарием.

В любом случае, мои имена файлов включают дефисы, и чтобы сделать его более надежным, я хочу разрешить пробелы в атрибуте alt, которые будут заменены дефисами в атрибуте src. Проблема в том, что команда .replace(), кажется, работает только с первым соответствующим символом, поэтому, если у меня есть три слова в атрибуте alt для описания img, второе пространство не заменяется, и путь img разрывается. *

Вот код вопроса:

<div class="copy"><img alt="three word alt" /></div>

<script>
    $('div.copy').find('img').each(function() {
        $(this).attr('src','/images/'+$(this).attr('alt').replace(' ','-')+'.png');
    });
</script>

Конечный результат должен быть

<img src="/images/three-word-alt.png" alt="three word alt" />

Но вместо этого это выглядит так:

<img src="/images/three-word alt.png" alt="three word alt" />

Может быть, есть лучший способ сделать это?

Answer 1

Используйте /g здесь, вот так:

$('div.copy').find('img').each(function() {
    $(this).attr('src','/images/'+$(this).attr('alt').replace(' '/g,'-')+'.png');
});
//or the regex version:
$('div.copy').find('img').each(function() {
    $(this).attr('src','/images/'+$(this).attr('alt').replace(/ /g,'-')+'.png');
});

/g - это глобальный модификатор , который сопоставляет все вхождения, а не только первое (по умолчанию) ... В этом отношении JavaScript немного странен по сравнению с большинством других языков.

Answer 2

String.replace () выполняет только одну замену, если первый аргумент является строковым литералом.Вместо этого используйте Regex в качестве первого аргумента.Пример:

$(this).attr('src','/images/'+$(this).attr('alt').replace(/ /g,'-')+'.png');

или

$(this).attr('src','/images/'+$(this).attr('alt').replace(/\s/g,'-')+'.png');

Answer 3

Должен сделать свое дело.

$(this).attr('src','/images/'+$(this).attr('alt').replace(/\s/g,'-')+'.png');