src로 속성의 값을 찾으십시오.

특정 img src가있는 속성 값을 찾아야합니다. 나는 이미지의 소스로 swap-section 가치를 얻을 수있는 방법이 있는지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>

이 궁금입니다.

나는

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 유효성 검사기를 통과하지 않습니다. 이것이 사용 케이스에 중요한 경우 @PSL에서 언급 한대로 data-* 속성을 조사해야합니다.

출처

2013-07-01 18:01:04

완벽하게 작동했습니다. –

src가 상대적이거나 절대적인 경우 또는 'url_main_pics'의 값이'src' 속성의 계산 된 값과 다른 경우 처리해야합니다. 아마'url_main_pic'이 상대적이며'$ ('img [src $ = "'+ url_main_pic + '"]')'를 사용하는 것일 수도 있습니다. – Orbling

@Orbling 좋은 점은 * 속성이 선택자와 동일하다는 것입니다. * 속성의 정확한 문자열에만 일치합니다. 나는 그런 간단한 질문에 대해 매우 복잡한 대답을하지는 않겠지 만, 다른 시나리오에서 일치시킬 수있는 방법이 있습니다. 예 : 전체 URL 속성을 상대 URL 속성과 일치 시키려면 [속성이 selector로 끝납니다.] (http://api.jquery.com/attribute-ends-with-selector/)를 사용할 수 있습니다. 그리고 다른 방법으로는 변수에서 도메인 부분을 제거하십시오. –

특성 선택기를 사용하여 일치하는 항목을 사용할 수 있습니다. 당신이 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 +'"]').attr("swap-section");

그러나 swap-section 및 swap-image는 유효한 HTML 속성 없습니다 그런 다음 와일드 카드 일치,

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로 속성의 값을 찾으십시오.

답변

관련 문제