通过src查找属性值

我需要找到具有某个img src的属性值。通过src查找属性值

<div class="ig_gallery_right_img" style="overflow-y: scroll"> 
    <img src="/corp/homeowner/images/promo/gallery_traditional_3_sm.jpg" 
      swap-section="featured_bath_traditional_1" 
      swap-image="/corp/homeowner/images/promo/gallery_traditional_3.jpg"    
      class="gallery_sidebar_sm" /> 
    <img src="/corp/homeowner/images/promo/gallery_traditional_5_sm.jpg" 
     swap-section="featured_bath_traditional_2" 
     swap-image="/corp/homeowner/images/promo/gallery_traditional_5.jpg" 
     class="gallery_sidebar_sm" /> 
</div>

我想知道如果有一种方法，我可以得到由图像源的swap-section值。

我已经试过var ig_sec = $('img', url_main_pic).attr('swap-section');

但是这给了我一个未定义的值。有任何想法吗？

来源

2013-07-01 T0ny lombardi

使用attribute selector：

var ig_sec = $('img[src="'+url_main_pic+'"]').attr('swap-section');

Demo

此外，尽管你的代码是全功能的这种方式，HTML将无法通过W3C验证。如果这对你的用例很重要，你应该查看data-*属性，如@PSL所述。

来源

2013-07-01 18:01:04

完美的工作谢谢你。 –

如果src是相对或绝对的，或者'url_main_pics'中的值与'src'属性中的计算值不同，则可能需要处理。也许确保'url_main_pic'是相对的并且使用'$（'img [src $ =''+ url_main_pic +'“'''）''。 – Orbling

@Orbling是的好点，*属性等于选择器*将只匹配属性中的确切字符串。对于这样一个简单的问题，我不会做出非常复杂的回答，但是在其他情况下可以采取相应的方法。例如。要将完整的URL属性与相关的URL属性进行匹配，可以使用[属性以选择器结尾]（http://api.jquery.com/attribute-ends-with-selector/）。另一种方法是，从变量中删除域部分。 –

您可以使用属性选择器进行匹配。

var value= $('img[src="'+ url +'"]').attr("swap-section");

但swap-section和swap-image是不是一个有效的HTML属性，所以你可能要考虑与data-*

<img src="/corp/homeowner/images/promo/gallery_traditional_3_sm.jpg" 
      data-swap-section="featured_bath_traditional_1" 
      data-swap-image="/corp/homeowner/images/promo/gallery_traditional_3.jpg"    
      class="gallery_sidebar_sm" /> 
    <img src="/corp/homeowner/images/promo/gallery_traditional_5_sm.jpg" 
     data-swap-section="featured_bath_traditional_2" 
     data-swap-image="/corp/homeowner/images/promo/gallery_traditional_5.jpg" 
     class="gallery_sidebar_sm" />

前缀他们和数据API

var value= $('img[src="'+ url +'"]').data("swap-section");

如果你想访问通配符匹配，

var value= $('img[src*="'+ url +'"]').data("swap-section"); //Remember for more than one match you will get the value of the first one alone. SO you may want to loop through.

来源

2013-07-01 18:03:13 PSL

呼叫良好。我正在研究这一点。 –

@TonyLombardi你的意思是数据*的东西？ – PSL

是的，先生。即时通讯接管别人的代码，这样就要求我写一大段代码。但是你的观点非常有效，我会尽力而为。 –

这有帮助吗？

$('img[src$="gallery_traditional_3_sm.jpg"]').attr('swap-section');

从我收集的内容来看，使用src前面的$符号将指定您只关心最后的jpg文件名。如果您不使用$，那么您需要使用图像的完整路径（包括域）。即使您在声明元素时没有将域作为src的一部分，但在内部将该域添加为属性的一部分，因此尝试通过使用相对src url来查找图像将不起作用，您将检索一个未定义的元素。

来源

2013-07-01 18:09:55 Lochemage

使用'[attribute-name $ = ...]'表示该属性应该以'='后面的值结尾。这是来自regexp语法，其中'$'匹配字符串的末尾。 – Orbling

通过src查找属性值

回答

相关问题