获取子 ID 并作为 ARIA 属性添加到父级

Get child ID and add to parent as ARIA attribute

本文关键字：添加 属性 ARIA ID 获取      更新时间：2023-09-26

我在页面上有许多图像和标题，设置在<figure><img><figcaption>组中。我想使用 JavaScript（或 jQuery）获取figcaption的 ID，并在父<figure>中添加一个 ' aria-labelledby ' 属性。

例如，我有以下内容（简化）：

<figure id="figure1">
    <img src="x.jpg">
    <figcaption id="caption1">Sample</figcaption>
</figure>
<figure id="figure2">
    <img src="y.jpg">
    <figcaption id="caption2">Sample</figcaption>
</figure>

如何遍历每个元素并添加适当的"aria-labelledby"属性，例如aria-labelledby="caption1"？

我试过这个，但得到一个未定义的函数错误：

$('figure').attr('aria-labelledby', function() {
    $(this).find('figcaption').attr('id');
})

任何帮助表示赞赏。

谢谢

你需要

return该值，否则你不会对它做任何事情。

$('figure').attr('aria-labelledby', function() {
    return $(this).find('figcaption').attr('id');
})
演示

$('figure').attr('aria-labelledby', function() {
  return $(this).find('figcaption').attr('id');
})
[aria-labelledby] {
  color: #f00;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<figure id="figure1">
    <img src="x.jpg">
    <figcaption id="caption1">Sample</figcaption>
</figure>
<figure id="figure2">
    <img src="y.jpg">
    <figcaption id="caption2">Sample</figcaption>
</figure>

相关文章：