Как добавить HTML к изображениям с помощью JQuery?

Question

Я использую Galleria , и мне нужно обернуть изображения, которые Galleria помещает в слайд со ссылкой.

Я собирался использовать эту методологию: Дайте <img> aфиктивное title= значение и затем добавьте тег <a> вокруг <img>, рисуя нужную мне ссылку из тега title=.

Это код, который я получил до сих пор.

$("img#gallery").this.title.appendTo("img#gallery") { });

Я пытаюсь заставить скрипт перебрать все изображения и добавить HTML.

Я также не знаю, следует ли мне использовать.appendTo или .before и .after

Answer 1

Такой подход будет работать.Вы ищете функцию обтекания:

var title = $('#test').attr('title');

$('#test').wrap('<a href="'+title+'" />');

Этот $ .each позволит вам перебирать серии:

<img src="" class="test" alt="test" title="http://www.google.com" />
<img src="" class="test" alt="test" title="http://www.yahoo.com" />

$.each($(".test"), function() {
    var title = $(this).attr('title');
    $(this).wrap('<a href="'+title+'" />');
});

Answer 2

Используйте $ .each для перебора всех изображений, которые вы хотите обернуть, а затем используйте

$('img#gallery').wrap('<a href='whatever'>) 

, чтобы обернуть его.Он автоматически закроет тег А.

Answer 3

Вы можете просто прослушать щелчок по всему объекту, а затем выяснить, было ли нажато изображение, и если да, то какое изображение, а затем изменить местоположение объекта.