如何在最接近我的元素的div中找到命名属性的值?

时间:2016-12-26 15:59:51

标签: jquery

在我的jquery脚本中,我想首先匹配所有图像元素,所以我成功地做到了这一点:

$("img")

现在我需要获取父div中包含的data-context-item-id属性的值。这是一个实际的块:

<div class="yt-lockup clearfix  yt-lockup-video yt-lockup-grid vve-check" data-context-item-id="zBpS7_GgvTs" data-visibility-tracking="CCsQlDUiEwitlY7EmpLRAhUFgU4KHYLMBDwomxxAu_qCjf_dlI3MAQ==">
   <div class="yt-lockup-dismissable">
      <div class="yt-lockup-thumbnail">
         <span class=" spf-link  ux-thumb-wrap contains-addto">
            <a href="/watch?v=zBpS7_GgvTs" class="yt-uix-sessionlink" aria-hidden="true" data-sessionlink="ei=pzthWO2lKoWCugKCmZPgAw&amp;feature=c4-videos-u&amp;ved=CEsQlx4iEwitlY7EmpLRAhUFgU4KHYLMBDwomxw">  <span class="video-thumb  yt-thumb yt-thumb-196">
            <span class="yt-thumb-default">
            <span class="yt-thumb-clip">
            <img width="196" aria-hidden="true" data-ytimg="1" alt="" src="https://i.ytimg.com/vi/zBpS7_GgvTs/hqdefault.jpg?custom=true&amp;w=336&amp;h=188&amp;stc=true&amp;jpg444=true&amp;jpgq=90&amp;sp=68&amp;sigh=qu9lcW3e2YYrWP8nChAGopv3wL4" onload=";__ytRIL(this)" style="display: none;">
...more here...

请注意包含名为data-context-item-id的属性的top-post div。我需要从zBpS7_GgvTs的选择器开始获取该值(在本例中为img)。

页面上会有很多这样的内容,所以我需要each()。我需要获取包含该属性的DIV的句柄,并且我还需要属性的值。提前谢谢。

2 个答案:

答案 0 :(得分:1)

您可以使用.each()方法和closest()

$("img").each(function(){
     $(this).closest('div[data-context-item-id]').data('context-item-id');
})

希望这有帮助。

&#13;
&#13;
$("img").each(function(){
  console.log( $(this).closest('div[data-context-item-id]').data('context-item-id') );
})
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div data-context-item-id="zBpS7_GgvTs111111">
  <img width="196" aria-hidden="true" data-ytimg="1" alt="" src="http://www.clker.com/cliparts/0/q/I/h/c/C/number-1-design-th.png"/>
</div>

<div data-context-item-id="zBpS7_GgvTs222222">
  <img width="196" aria-hidden="true" data-ytimg="1" alt="" src="http://www.clker.com/cliparts/R/q/f/z/C/C/2-in-circle-th.png"/>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

试试这个。

$("img").each(function(){
    console.log($(this).parents().('div[data-context-item-id]').data('context-item-id'));
});