Ich erstelle eine Website mit schwebender Breite. Die Benutzer verwenden Bildschirme von voller HD-Auflösung bis zu einigen 600px auf Smartphones, es scheint eine ziemlich gute Idee zu sein. Dies wirft ein sehr interessantes Problem auf.
Wenn der Benutzer eine kleinere Auflösung verwendet als ein Optimum, erhält die Seite viel mehr Höhe. Das bedeutet, dass es sinnvoll sein kann, die Reihenfolge einiger Elemente zu ändern (z. B. ein Bild, ein Suchfeld oder eine Navigation), um die Seite lesbarer zu machen, ohne dass viel Scrooling erforderlich ist.
Also muss ich in der Lage sein, auf DOM zuzugreifen und die Reihenfolge einiger Seitenelemente zu ändern (sie zu tauschen).
Sagen wir, ich habe eine Liste und muss die Elemente 1 und 2 tauschen.
%Vor% Ich habe eine Lösung gefunden, die auf dem Anhängen von Items-Elementen an <ul> basiert, indem ich die Funktion appendChild verwendet habe. Es gibt jedoch ein Problem mit Textknoten und es wird sehr kompliziert, dies für eine schwierigere Elementstruktur zu tun, da es notwendig ist, es wieder ganz neu zu erstellen.
Haben Sie Vorschläge, es zu verbessern?
Für diesen einfachen Fall (Tauschen Sie die beiden einzigen Elemente aus) können Sie einfach appendChild() ( Geige ) verwenden
Derselbe Knoten kann nicht in mehreren Positionen existieren; Also wird es von seiner aktuellen Position entfernt und am Ende der Sammlung platziert.
Wenn Sie eine kompliziertere Sortierung durchführen möchten, sollten Sie wahrscheinlich ein Array aus den childNodes ( yaf ) erstellen und abrufen alles verrückt:
%Vor%Tags und Links javascript html dom