Распаковка атрибута img src

Question

Я использую jQuery для отображения изображения одним нажатием. Это прекрасно работает путем сохранения источника изображения в переменную, как так ..

var theSrc = $(event.target).attr('src'); 

Затем я могу поместить это изображение в DIV и показать его

var theImg = '<div class="wrap"><img src="'+imgSrc+'"></div>'; 

То, что я хотел бы сделать, был бы просто изменить источник изображения немного больший файл в том же каталоге, который больше, присоединяя «большой» к имени

image.png 

в

imageBig.png 

Возможно ли это с помощью jQuery?

Answer 1

Я бы просто использовать .replace() - это проще, чем .split() для такого использования:

var theSrc = $(event.target).attr('src').replace('.png', 'Big.png'); 

Также предложение: я бы устранил шумовые слова, такие как the из ваших имен переменных. Вместо theSrc используйте src. Вместо theImg используйте img. Слово the ничего не сообщает и не имеет значения в имени переменной. На самом деле это значение отрицательное значение, потому что это лишний материал для чтения, который не добавляет никакого смысла в более простое имя.

Answer 2

Sure:

$("img").attr("src", "imageBig.png"); 

Смотрите документацию JQuery: http://api.jquery.com/attr/#attr2 Есть несколько ароматов ATTR, которые вы можете использовать.

Чтобы сделать это динамически, см. Сообщение @ tymeJV, которое будет работать до тех пор, пока в имени файла есть только один период.

Answer 3

Вы можете сделать что-то вроде:

var theSrc = $(event.target).attr('src'); 
theSrc = theSrc.split(".")[0] + "Big." + thetheSrc.split(".")[1]; 

Answer 4

Не с JQuery, но вы можете сделать это с помощью Javascript:

var temp = imgSrc.split('.'); 
var newSrc = temp[0]+'Big.'+temp[1];