javascript - HTML：存储实体ID的元素/属性

Question

我有一个索引路由，它将数据库中的所有持久图像实体呈现为某种格式，如下所示：

<div class="image field">
  <h3>image-name</h3>
  <img src="imagefilename.jpg" />
</div>

我现在如何在每个渲染的 div-image-container 中渲染一个 id，jquery 可以解析并用于 ajax？

抱歉忘记了：

我的意思不是整数形式的 id，而是字符串（slug）

Answer 1

根据 HTML5，似乎最合适的方法是为 id 和其他用户定义的属性使用数据属性：

<div class="image field" data-id="1">
  <h3>image-name</h3>
  <img src="imagefilename.jpg" />
</div>

您可以使用 id 代替 data-id。但我认为id属性用于 DOM 操作，而 data-id 是基于逻辑的属性。

Answer 2

您需要向标签中添加一个id，<img>或者您可以使用 JQuery 选择器来挑选具有相同<div>结构的每个元素，如下所示

见jsfiddle

<div class="image-field">
    <h3>image-name</h3>
    <img src="image.png" />
</div>

$(function() {
   alert($('div.image-field img').attr('src'))
})

// will output: "image.png"

注意：我已经更改了此示例id的包含内容div

如果您在一个页面上有多个这些，您可以循环它们，如此JSFiddle所示