Experiment: Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.

Element: Methode moveBefore()

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Die moveBefore()-Methode des Element-Interfaces verschiebt einen angegebenen Node innerhalb des aufrufenden Knotens als direktes Kind vor einen angegebenen Referenzknoten.

Syntax

moveBefore(movedNode, referenceNode)

Parameter

movedNode: Ein Node, der den zu verschiebenden Knoten darstellt. Beachten Sie, dass dies ein Element- oder ein CharacterData-Knoten sein muss.
referenceNode: Ein Node, vor dem movedNode verschoben wird, oder null. Wenn der Wert null ist, wird movedNode am Ende der Kindknoten des aufrufenden Knotens eingefügt.

Ausnahmen

HierarchyRequestError TypeError

Wird in einer der folgenden Situationen ausgelöst:

Der angegebene movedNode ist nicht Teil des DOM und Sie versuchen, ihn in einen Knoten zu verschieben, der Teil des DOM ist, oder umgekehrt.
Der angegebene movedNode ist ein Vorfahre des Elements, auf dem moveBefore() aufgerufen wird.
Sie versuchen, movedNode zwischen zwei verschiedenen Dokumenten zu verschieben.
Der angegebene movedNode ist weder ein Element- noch ein CharacterData-Knoten.

NotFoundError TypeError

Der angegebene referenceNode ist kein Kind des Knotens, auf dem Sie moveBefore() aufrufen, d.h. des Knotens, in den Sie movedNode verschieben möchten.

TypeError TypeError

Das zweite Argument wurde nicht angegeben.

Die moveBefore()-Methode verschiebt einen angegebenen Knoten an eine neue Stelle im DOM. Sie bietet ähnliche Funktionalität wie die Methode Node.insertBefore(), entfernt und fügt den Knoten jedoch nicht erneut ein. Dies bedeutet, dass der Zustand des Knotens (der zurückgesetzt würde, wenn er mit insertBefore() und ähnlichen Mechanismen verschoben wird) nach dem Verschieben erhalten bleibt. Dies umfasst:


Versuchen Sie, einige Male auf das

`Demonstration der Zustandserhaltung`

In diesem Demo bieten wir mehrere Mechanismen, um ein

-Element mit einem YouTube-Embed zwischen zwei verschiedenen Containern zu verschieben. Dabei wird gezeigt, wie moveBefore() den Wiedergabezustand des Embed erhält, während die anderen Mechanismen dies nicht tun.
HTML
Das HTML umfasst ein 
-Element, das zwei -Elemente enthält. Das erste -Element enthält ein -Element mit dem YouTube-Embed-Code. Darüber hinaus haben wir ein -Element mit drei 
  
  


CSS
Wir verwenden flexbox für die Anordnung, um die beiden 
-Elemente nebeneinander zu platzieren und die Buttons gleichmäßig im controls- zu verteilen.
css
#wrapper,
#controls {
  width: 100%;
  display: flex;
}

#wrapper {
  margin-bottom: 10px;
}

section {
  flex: 1;
  padding: 10px;
}

#controls {
  display: flex;
  justify-content: space-around;
}

#section1 {
  background-color: hotpink;
}

#section2 {
  background-color: orange;
}

#mover {
  max-width: 100%;
  background-color: black;
}

JavaScript
In unserem Skript fügen wir jedem 
Spezifikationen
Specification
DOM 
# dom-parentnode-movebefore
Browser-Kompatibilität
Siehe auch

Document.moveBefore()
DocumentFragment.moveBefore()
Node.insertBefore()
MDN-Feedback-Box
War diese Übersetzung hilfreich?
Diese Seite wurde automatisch aus dem Englischen übersetzt.
Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden

Element: Methode moveBefore()

Syntax

Parameter

Rückgabewert

Ausnahmen

Beschreibung

`Demonstration der Zustandserhaltung`

HTML

CSS

JavaScript

Ergebnis

Spezifikationen

Browser-Kompatibilität

Siehe auch