jQuery에서 클래스 내의 일치하는 요소 속성에 텍스트 추가

Question

<div class="container"> 
consectetur <a href="foo.php?q=bar">adipisicing</a> 
</div> 

여기서? q = 막대가 추가 된 클래스 내 텍스트 블록 내의 링크에 쿼리 매개 변수를 추가하려고합니다.

내 함수는 다음과 같습니다.

function appendRef(container,reftag) { 
    var Link = $(container).attr("href"); 
    var afterLink = reftag; 

     $(container).attr({ 
      href: (Link + afterLink) 
      }); 
} 


appendRef(".container a", "?q=bar"); 

그러나 div의 모든 링크는 고유 한 처리보다는 처음에 반환 된 값으로 변환됩니다. 또한 원래 URL의 일부를 기반으로 함수를 필터링 할 수 있도록 노력하고 있습니다.

if Link.match(/domain/) { //append the param 
} 

과 같은 것

Answer 1

같은 뭔가 예, 정적 값 (첫 번째 HREF의 하나)에 링크 변수를 설정한다.

당신은이 같은 변수에 쿼리를 저장해야 할 것 :

이

var links = $("." + container + " a"); 

그래서 링크 다음 당신이 그것을 통해 루프 수, 배열하고 그 href가

Answer 2

에 텍스트를 추가 할 것

나는 jQuery 남자는 아니지만 css selector가 결과 배열을 반환한다는 것을 알고있다. 솔루션은 요소를 반복하고 원하는 변경 사항을 적용하는 것입니다. 또한 영향을받는 URL을 제한하려면 match 속성 (선택 사항)을 href을 테스트하는 함수에 던졌습니다.

function appendRef(container,reftag, match) { 
     match = match || /.*/ 
     $(container).each(function() { 
      if ($(this).attr('href').match(match)) { 
       //do url magic here 
      } 
     }) 
} 

Answer 3

당신은 당신이 당신의 선택에 의해 반환 된 세트의 첫 번째 요소의 값을 취 함수의 시작 부분에 변수를 연결 설정할 때 이미 지적 된 것처럼. 업데이트하기 전에 세트의 각 요소에 대한 href를 계산해야합니다.

.each를 호출하고 클로저 내부에서 .attr을 사용하거나 콜백을 허용하는 attr 버전을 사용하여 요소별로 로직을 수행 할 수 있습니다.

$(".container a").attr("href", 
    function(idx) { //idx is the index of the element in the set 
     return this.href.match(/domain/) ? this.href + afterLink : this.href; 
    } 
); 

Answer 4

굉장합니다. 필자는이를 기반으로 기존 링크에 이미 param이있는 경우이를 수정하여 새로운 링크로 대체합니다.

function appendRef(container, reftag, match) { 
$(container).each(function() { 

    if ($(this).attr('href').match(match)) {     
     var href = $(this).attr('href');     
     var href = href.replace(/\?.*$/,''); 
     var href = (href + reftag); 
     $(this).attr('href', href);   

    } 
}); 
} 

appendRef(".container a", "?q=foo", "domain");