js-Implementierung der offset()-Methode von jquery example_javascript skills

Das Beispiel in diesem Artikel beschreibt, wie js die offset()-Methode von jquery implementiert. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Schüler, die offset() von jQuery verwendet haben, wissen, dass offset().top oder offset().left leicht den Offset eines Elements relativ zur gesamten Seite ermitteln kann.

In js gibt es keine solche direkte Methode. Das Attribut offsetTop des Knotens kann den relativen Versatz des Knotens relativ zum übergeordneten Knoten ermitteln, aber nicht direkt seinen absoluten Versatz. Wir können die Knoten verwenden, um Schicht für Schicht nach oben zu rekursieren und addiere sie offsetTop, um den absoluten Offset zu erhalten.

Code kopieren Der Code lautet wie folgt:

Funktion getOffset(Node, offset) {
Wenn (!offset) {
Offset = {};
Offset.top = 0;
Offset.left = 0;
}

if (Node == document.body) {//Wenn der Knoten der Körperknoten ist, beenden Sie die Rekursion
         Rückgabe-Offset;
}

offset.top = Node.offsetTop;
Offset.left = Node.offsetLeft;

return getOffset(Node.parentNode, offset); // Akkumuliere den Wert im Offset nach oben
}

Bei Verwendung von

lautet es wie folgt:

Code kopieren Der Code lautet wie folgt:

var a = document.getElementById('a');
//getOffset(a).top
//getOffset(a).left

Ich hoffe, dass dieser Artikel für das JavaScript-Programmierdesign aller hilfreich sein wird.