Heim >Web-Frontend >js-Tutorial >Wie ändere ich das Href-Attribut eines Anker-Tags dynamisch mit JavaScript?

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

Patricia Arquette
Patricia ArquetteOriginal
2024-10-26 20:41:29339Durchsuche

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>

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>

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>

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>

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!

Stellungnahme:
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