将属性转换为标题答案

【问题标题】：Converting attribute to caption将属性转换为标题
【发布时间】：2012-09-29 07:14:44
【问题描述】：

我正在使用以下代码从列表中的每个图像中获取标题属性：

$("ul#images li img").each(function(index) {
    $(this).attr("title");
});

然后我怎样才能将此属性用作每张图片的标题？我是否首先需要以某种方式将其转换为字符串，然后将其附加到列表项？

谢谢

【问题讨论】：

【解决方案1】：

属性总是字符串，title 属性也是字符串，所以你只需要附加它。

$("ul#images li img").each(function() {
    $(this).closest('li').append('<br>' + this.title);
});

现在，如果您正在寻找更语义化的 HTML5 解决方案，我建议您使用 figure 和 figcaption 元素：

$("ul#images li img").each(function() {
    $(this).wrap('<figure/>').after($('<figcaption>', {text: this.title}));
});

【讨论】：

【解决方案2】：

您需要一些 CSS 和修改您的 javascript。但基本上你获取 attr 值并将其附加到你喜欢的位置。

使用您的示例：

$("ul#images li img").each(function(index) {
    $(this).parent().append('<div class="caption">'+$(this).attr("title")+'</div>');
});

【讨论】：