So ändern Sie die href für einen Hyperlink mit jQuery

Ab jQuery 1.6 sollten Sie Folgendes verwenden:

$("a").prop("href", "http://www.jakcms.com")

Der Unterschied zwischen prop und attr besteht darin, dass attr das HTML-Attribut erfasst, während prop die DOM-Eigenschaft erfasst.

Weitere Details finden Sie in diesem Beitrag: . Prop () vs .attr ()

Verwenden Sie die Methode attr für Ihre Suche. Sie können jedes Attribut mit einem neuen Wert ausschalten.

$("a.mylink").attr("href", "http://cupcream.com");

Abhängig davon, ob Sie alle identischen Links zu etwas anderem ändern oder nur die Links in einem bestimmten Abschnitt der Seite oder für jeden einzelnen einzeln steuern möchten, können Sie einen dieser Links ausführen.

Ändern Sie alle Links zu Google, sodass sie auf Google Maps verweisen:

<a href="http://www.google.com">

$("a[href='http://www.google.com/']").attr('href', 
'http://maps.google.com/');

Um die Links in einem bestimmten Abschnitt zu ändern, fügen Sie die Klasse des Container-Div zur Auswahl hinzu. In diesem Beispiel wird der Google-Link im Inhalt geändert, nicht jedoch in der Fußzeile:

<div class="content">
    <p>...link to <a href="http://www.google.com/">Google</a>
    in the content...</p>
</div>

<div class="footer">
    Links: <a href="http://www.google.com/">Google</a>
</div>

$(".content a[href='http://www.google.com/']").attr('href', 
'http://maps.google.com/');

Wenn Sie einzelne Links ändern möchten, unabhängig davon, wo sie sich im Dokument befinden, fügen Sie der Verknüpfung eine ID hinzu und fügen Sie diese dann der Auswahl hinzu. In diesem Beispiel wird der zweite Google-Link im Inhalt geändert, nicht jedoch der erste oder der in der Fußzeile:

<div class="content">
    <p>...link to <a href="http://www.google.com/">Google</a>
    in the content...</p>
    <p>...second link to <a href="http://www.google.com/" 
        id="changeme">Google</a>
    in the content...</p>
</div>

<div class="footer">
    Links: <a href="http://www.google.com/">Google</a>
</div>

$("a#changeme").attr('href', 
'http://maps.google.com/');

_{Obwohl das OP explizit nach einer jQuery-Antwort gefragt hat, müssen Sie jQuery heutzutage nicht mehr für alles verwenden.}

Einige Methoden ohne jQuery:

• Wenn Sie den href Wert von allen <a> Elementen ändern möchten Wählen Sie sie alle aus und durchlaufen Sie dann die Knotenliste : (Beispiel)

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

• Wenn Sie den href Wert aller <a> Elemente ändern möchten, die tatsächlich ein href Attribut haben, wählen Sie diese aus, indem Sie den [href] Attributselektor (a[href]) hinzufügen. : (Beispiel)

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

• Wenn Sie den href Wert von <a> Elementen ändern möchten, die einen bestimmten Wert enthalten , zum Beispiel google.com, verwenden Sie den Attributselektor a[href*="google.com"]: (Beispiel)

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

  Ebenso können Sie auch die anderen Attributselektoren verwenden. Zum Beispiel:

  • a[href$=".png"] kann verwendet werden, um <a> Elemente auszuwählen, deren href Wert mit .png endet.

  • a[href^="https://"] kann verwendet werden, um <a> Elemente mit href Werten auszuwählen, denen https:// vorangestellt ist .

• Wenn Sie den href Wert von <a> Elementen ändern möchten, die mehrere Bedingungen erfüllen: (Beispiel)

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

..keine Notwendigkeit für Regex, in den meisten Fällen.

Dieses Snippet wird aufgerufen, wenn auf einen Link der Klasse 'menu_link' geklickt wird, und zeigt den Text und die URL des Links an. Der Rückgabewert false verhindert, dass dem Link gefolgt wird.

<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;
});

Der einfache Weg dazu ist:

Attr-Funktion (seit jQuery Version 1.0)

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

oder

Prop function (seit jQuery Version 1.6)

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

Der Vorteil der obigen Methode ist auch, dass, wenn der Selektor einen einzelnen Anker auswählt, nur dieser Anker aktualisiert wird. Wenn der Selektor eine Gruppe von Ankern zurückgibt, wird die bestimmte Gruppe nur über eine Anweisung aktualisiert.

Nun gibt es viele Möglichkeiten, den genauen Anker oder die Gruppe von Ankern zu identifizieren:

Ganz einfache:

1. Wählen Sie den Anker über den Tag-Namen aus: $("a")
2. Anker durch Index auswählen: $("a:eq(0)")
3. Anker für bestimmte Klassen auswählen (wie in dieser Klasse nur Anker mit der Klasse active): $("a.active")
4. Auswählen von Ankern mit einer bestimmten ID (hier im Beispiel profileLink ID): $("a#proileLink")
5. Auswahl der ersten Anker-Referenz: $("a:first")

Nützlichere:

6. Auswahl aller Elemente mit dem Attribut href: $("[href]")
7. Auswahl aller Anker mit spezifischem href: $("a[href='www.stackoverflow.com']")
8. Auswahl aller Anker ohne spezifische Referenz: $("a[href!='www.stackoverflow.com']")
9. Auswahl aller Anker mit href, die eine bestimmte URL enthalten: $("a[href*='www.stackoverflow.com']")
10. Auswahl aller Anker mit href beginnend mit einer bestimmten URL: $("a[href^='www.stackoverflow.com']")
11. Auswahl aller Anker mit href, die mit einer bestimmten URL enden: $("a[href$='www.stackoverflow.com']")

Wenn Sie nun bestimmte URLs ändern möchten, können Sie dies folgendermaßen tun:

Wenn Sie beispielsweise eine Proxy-Website für alle URLs hinzufügen möchten, die zu google.com gehen, können Sie diese wie folgt implementieren:

$("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);
    });
   });

Stoppen Sie die Verwendung von jQuery nur deswegen! Dies ist nur mit JavaScript so einfach.

document.querySelector('#the-link').setAttribute('href', 'http://google.com');

https://jsfiddle.net/bo77f8mg/1/

 $("a[href^='http://stackoverflow.com']")
   .each(function()
   { 
      this.href = this.href.replace(/^http:\/\/beta\.stackoverflow\.com/, 
         "http://stackoverflow.com");
   });

Ändern Sie die HREF des Wordpress Avada Theme Logo Image

Wenn Sie das Plugin ShortCode Exec PHP installieren, können Sie diesen Shortcode erstellen, den ich als myjavascript bezeichnet habe

?><script type="text/javascript">
jQuery(document).ready(function() {
jQuery("div.fusion-logo a").attr("href","tel:303-985-9850");
});
</script>

Sie können jetzt zu Darstellung/Widgets gehen und einen der Fußzeilen-Widget-Bereiche auswählen und mit einem Text-Widget den folgenden Shortcode hinzufügen

[myjavascript]

Die Auswahl kann sich ändern, je nachdem, welches Bild Sie verwenden und ob es für die Netzhaut bereit ist. Sie können dies jedoch jederzeit mit den Entwicklertools herausfinden.

href in einem Attribut, sodass Sie es mit reinem JavaScript ändern können. Wenn Sie jedoch bereits jQuery in Ihre Seite eingefügt haben, müssen Sie sich keine Sorgen machen, ich zeige es in beide Richtungen:

Stellen Sie sich vor, Sie haben dieses href unten:

<a id="ALi" alt="ALi" href="http://dezfoolian.com.au">Alireza Dezfoolian</a>

Und Sie möchten es den Link ändern ...

Mit reines JavaScript können Sie ohne Bibliothek Folgendes tun:

document.getElementById("ALi").setAttribute("href", "https://stackoverflow.com");

Aber auch in jQuery können Sie Folgendes tun:

$("#ALi").attr("href", "https://stackoverflow.com");

oder

$("#ALi").prop("href", "https://stackoverflow.com");

In diesem Fall, wenn Sie bereits jQuery injiziert haben, sieht jQuery wahrscheinlich kürzer und browserübergreifender aus ... aber ansonsten gehe ich mit dem JS ein ...