[javascript] jQuery를 사용하여 하이퍼 링크의 href를 변경하는 방법

_{OP가 명시 적으로 jQuery 답변을 요청했지만 요즘 모든 것에 jQuery를 사용할 필요는 없습니다.}

jQuery가없는 몇 가지 방법 :

• 모든 요소 의 href값 을 변경하려면 모든 <a> 요소를 선택한 다음 노드 목록 을 반복하십시오 . (예)

  var anchors = document.querySelectorAll('a');
  Array.prototype.forEach.call(anchors, function (element, index) {
      element.href = "http://stackoverflow.com";
  });

• 실제로 속성 이있는 href모든 <a>요소 의 값 을 변경 href하려면 [href]속성 선택기 ( a[href])를 추가하여 선택하십시오 (예).

  var anchors = document.querySelectorAll('a[href]');
  Array.prototype.forEach.call(anchors, function (element, index) {
      element.href = "http://stackoverflow.com";
  });

• 당신이 변경하려는 경우 href의 값 <a>요소를 포함 예를 들어, 특정 값을 google.com, 속성 선택 사용 a[href*="google.com"]: (예)

  var anchors = document.querySelectorAll('a[href*="google.com"]');
  Array.prototype.forEach.call(anchors, function (element, index) {
      element.href = "http://stackoverflow.com";
  });

  마찬가지로 다른 속성 선택기를 사용할 수도 있습니다 . 예를 들어 :

  • a[href$=".png"]값이로 끝나는 <a>요소 를 선택하는 데 사용할 수 있습니다 .href.png

  • a[href^="https://"]선택하는 데 사용할 수 <a>와 요소 href된 값 접두어 로를 https://.

• 여러 조건을 만족하는 요소 의 href값 을 변경하려는 경우 <a>: (예)

  var anchors = document.querySelectorAll('a[href^="https://"], a[href$=".png"]');
  Array.prototype.forEach.call(anchors, function (element, index) {
      element.href = "http://stackoverflow.com";
  });

.. 대부분의 경우 정규 표현식이 필요하지 않습니다 .

답변

<a rel='1' class="menu_link" href="option1.html">Option 1</a>
<a rel='2' class="menu_link" href="option2.html">Option 2</a>

$('.menu_link').live('click', function() {
   var thelink = $(this);
   alert ( thelink.html() );
   alert ( thelink.attr('href') );
   alert ( thelink.attr('rel') );

   return false;
});

$("a").attr("href", "https://stackoverflow.com/") 

$("a").prop("href", "https://stackoverflow.com/")

$("a[href^='http://www.google.com']")
   .each(function()
   {
      this.href = this.href.replace(/http:\/\/www.google.com\//gi, function (x) {
        return "http://proxywebsite.com/?query="+encodeURIComponent(x);
    });
   });