Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie ändere ich das Href-Attribut eines Anker-Tags dynamisch mit JavaScript?

Patricia Arquette
Freigeben: 2024-10-26 20:41:29
Original
277 Leute haben es durchsucht

How to Dynamically Change the Href Attribute of an Anchor Tag with JavaScript?

Ändern des Href-Attributwerts eines Anker-Tags beim Klicken auf eine Schaltfläche über JavaScript

Ändern des Href-Attributs eines Ankers () Tag-on-Button-Klick mit JavaScript kann durch verschiedene Methoden erreicht werden. Hier sind einige effektive Ansätze:

Verwendung eines leeren Href-Attributs

Um die Funktionalität der aktuellen Seite ohne Neuladen beizubehalten, weisen Sie dem Ankertag ein leeres Href-Attribut zu:

<code class="html"><a href="#" onclick="f1()"></a></code>
Nach dem Login kopieren

Scrollen verhindern

Die Standardaktion eines leeren href-Links besteht darin, die Seite nach oben zu scrollen. Um dies zu verhindern, fügen Sie ein „return false;“ hinzu. Anweisung an die Onclick-Funktion oder inline:

<code class="html"><a href="#" onclick="f1(); return false;"></a></code>
Nach dem Login kopieren

False von der Funktion zurückgeben

Sie können auch False von der Onclick-Funktion zurückgeben:

<a href="#" onclick="return f1()"></a>

<script>
function f1() {
  // perform actions
  return false;
}
</script>
Nach dem Login kopieren

Unaufdringlicher JavaScript-Ansatz

Für einen besser organisierten Ansatz verwenden Sie unaufdringliches JavaScript, um das Anker-Tag auszuwählen und das Klickereignis separat zu behandeln:

<a href="#" id="abc"></a>
<a href="#" id="myLink"></a>

<script>
document.getElementById("myLink").onclick = function() {
  document.getElementById("abc").href = "xyz.php";
  return false;
};
</script>
Nach dem Login kopieren

Von Durch die Umsetzung dieser Strategien können Sie das href-Attribut eines Anker-Tags beim Klicken auf eine Schaltfläche mithilfe von JavaScript effektiv ändern, um die gewünschte Funktionalität zu erreichen und die Kompatibilität zwischen Browsern aufrechtzuerhalten.

Das obige ist der detaillierte Inhalt vonWie ändere ich das Href-Attribut eines Anker-Tags dynamisch mit JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!