JQuery从<img/>获取所有<alt>标记,并在<ul> <li> </li> </ul> </alt>中显示它们

时间:2010-11-22 08:07:21

标签: jquery html image galleria

这是我的HTML(即时通讯使用Galleria图库 - 基于JQuery)

<div id="galleria">
            <img alt="Productname 1" src="bens_img/1.jpg">
            <img alt="Productname 2" src="bens_img/2.jpg">
            <img alt="Productname 3" src="bens_img/3.jpg">
            <img alt="Guess what?" src="bens_img/4.jpg">
        </div>

伪代码

Get string from <alt> from <img>
Create a new <li> and paste the <alt> string from <img> in it

这应该用所有(即:四个)img alt字符串完成。它应该是这样的:

<ul class="textformat">
<li>Productname 1</li>
<li>Productname 2</li>
<li>Productname 3</li>
<li>Guess what?</li>
</ul> <!-- yeah this was all done by java-script -->

5 个答案:

答案 0 :(得分:6)

像这样:

$("#galleria > img").each(function(i, ele) {
  $(".textformat").append("<li>"+$(ele).attr("alt")+"</li>");
});

答案 1 :(得分:0)

$("img[alt]")

用于标记每个具有'alt'

的图像

答案 2 :(得分:0)

您需要.attr jQuery选择器:

$('#galleria > img').each(function(){
  $('.textformat').append('<li>'+ $(this).attr('alt') +'</li>');
});

或者您可以使用$('#galleria').find('img')$('#galleria').children('img')

答案 3 :(得分:0)

尝试使用jQuery的map()函数:

$('#galleria img').map(function() {
  return '<li>' + this.alt + '</li>';
}).appendTo('ul.textformat');

答案 4 :(得分:0)

你可以扩展galleria将alt标签或描述放在另一个div中,不知道如何把它放到li中,我想猜一些jQuery extend: function() { this.bind(Galleria.IMAGE, function(e) { $('.caption').html(this.$('info-description').html()); }) }