Μέθοδος replaceChild() του στοιχείου DOM HTML

Ορισμός και χρήση

replaceChild() Η μέθοδος αντικαθιστά το υποκείμενο κόμβο με νέο κόμβο.

Για περισσότερες πληροφορίες:

Μέθοδος removeChild()

Μέθοδος remove()

Μέθοδος appendChild()

Μέθοδος insertBefore()

Πρόσφατα στοιχεία

Πρώτο στοιχείο

Πρόσφατο στοιχείο

Πρώτο στοιχείο στοιχείου

Πρόσφατο στοιχείο στοιχείου

Σχετικές μεθόδους DOM HTML:

Μέθοδος createElement()

Μέθοδος createTextNode()

Παράδειγμα

Παράδειγμα 1

Αντικαταστήστε τον κείμενο του στοιχείου <li> με νέο κείμενο κόμβο:

const newNode = document.createTextNode("Water");
const element = document.getElementById("myList").children[0];
element.replaceChild(newNode, element.childNodes[0]);

Πριν την αντικατάσταση:

  • Coffee
  • Tea
  • Milk

Μετά την αντικατάσταση:

  • Water
  • Tea
  • Milk

Δοκιμάστε το προσωπικά

Παράδειγμα 2

Αντικαταστήστε το στοιχείο <li> με ένα νέο στοιχείο <li>:

// Δημιουργήστε ένα νέο στοιχείο <li>:
const element = document.createElement("li");
// Δημιουργήστε έναν νέο κόμβο κειμένου:
const textNode = document.createTextNode("Water");
// Προσθέστε τον κόμβο κειμένου στον κόμβο <li>:
element.appendChild(textNode);
// Ανακτήστε το στοιχείο <ul> με id="myList":
const list = document.getElementById("myList");
// Αντικαταστήστε τον πρώτο υποκόμβο με ένα νέο <li> στοιχείο:
list.replaceChild(element, list.childNodes[0]);

Πριν την αντικατάσταση:

  • Coffee
  • Tea
  • Milk

Μετά την αντικατάσταση:

  • Water
  • Tea
  • Milk

Δοκιμάστε το προσωπικά

Γλώσσα

node.replaceChild(newnode, oldnode)

Παράμετροι

Παράμετροι Περιγραφή
newnode Απαιτείται. Ο κόμβος που πρέπει να εισαχθεί.
oldnode Απαιτείται. Ο κόμβος που πρέπει να αφαιρεθεί.

Επιστροφή τιμής

Τύπος Περιγραφή
Όνειρο αντικείμενο Ο κόμβος που αντικαθιστάται.

Υποστήριξη του περιηγητή

element.replaceChild() Είναι χαρακτηριστικό DOM Level 1 (1998).

Όλοι οι περιηγητές υποστηρίζουν πλήρως αυτό:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Υποστήριξη 9-11 Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη