Heim  >  Artikel  >  Web-Frontend  >  Wie ersetze ich DOM-Elemente direkt durch JavaScript?

Wie ersetze ich DOM-Elemente direkt durch JavaScript?

Linda Hamilton
Linda HamiltonOriginal
2024-11-01 06:33:31482Durchsuche

How to Replace DOM Elements In-Place with JavaScript?

DOM-Elemente direkt durch JavaScript ersetzen

Das Ersetzen eines Elements im DOM kann eine nützliche Technik in der Webentwicklung sein. Wenn Sie beispielsweise ein Ankerelement () durch ein Span-Element () ersetzen möchten, können Sie dies mit JavaScript tun.

Der effektivste Ansatz zum Ersetzen eines Das vorhandene DOM-Element soll die Methode replaceChild() verwenden. So würden Sie dies implementieren:

  1. Erhalten Sie einen Verweis auf die DOM-Elemente:

    <code class="javascript">var myAnchor = document.getElementById("myAnchor");
    var mySpan = document.createElement("span");</code>
  2. Ändern Sie den Inhalt des neuen Elements:

    <code class="javascript">mySpan.innerHTML = "replaced anchor!";</code>
  3. Ersetzen Sie das ursprüngliche Element durch das neue mit der Methode replaceChild() des parentNode:

    <code class="javascript">myAnchor.parentNode.replaceChild(mySpan, myAnchor);</code>

Dieser Vorgang verläuft nahtlos Ersetzen Sie das Ankerelement () durch das Span-Element (), wobei die Position des Elements im DOM erhalten bleibt.

Das obige ist der detaillierte Inhalt vonWie ersetze ich DOM-Elemente direkt durch 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