Question

我有一个像这样的图像库：

<section>
    <div class='centered_image' >
        <img src='images/image1.jpg' alt='first image' />
    </div>
    <div class='centered_image' >
       <img src='images/image2.jpg' alt='second image' />
   </div>
   [etc.]
</section>

我需要在图像周围的每个div上添加一个属性data-caption，其值为alt，但我无法更改HTML。

以下是我尝试的内容：

$(function() {
    var caption = $('.centered_image img').attr('alt');
    $('.centered_image').each(function(){
        $(this).attr('data-caption', caption);
    });
});

但是，对于每个alt，它使用第一个图像的data-caption值。

我做错了什么？

Answer 1

您可以使用string[] splitVapo = value.Split('\u000A');获取相应的alt属性，在循环中使用它。

$(this).find("img").attr("alt")

Answer 2

您需要迭代每个centered_image div并获取图像以进行读取和设置标题。

$(function() {
    $('.centered_image').each(function(){
        $(this).attr('data-caption', $(this).find('img').attr('alt'));
    });
});

或者您也可以使用

$(function() {
    $('.centered_image').attr('data-caption', function(){
        return $(this).find('img').attr('alt');
    });
});

重用父母的属性值

2 个答案: