Que signifie offset en js et son explication détaillée ?

offset signifie "déviation, déplacement" et appartient à une série d'attributs en js, dont "offsetHeight", "offsetWidth", "offsetLeft", "offsetTop", "offsetParent" ; taille de l'élément.

famille offset

1, offsetWidth offsetHeight obtient la largeur et la hauteur de l'objet (votre propre width et High)

offsetWidth = width + border + padding;
        offsetHeight = height + border + padding;
        p.style.width  只能得到行内样式的数值

2, offsetLeft et offsetTop renvoient la position à partir de la gauche et du haut de la boîte parent (avec positionnement),

Si le parent n'est pas positionné, le corps prévaudra. Le parent ici fait référence à tous les niveaux précédents, pas seulement au père,

offsetLeft commence à partir du remplissage du père, la frontière du père ne compte pas

3, assouplissement de l'animation. Formule

    var start=0,  end = 0;
        setInterval(function(){
                start = start + (end - start)/10;
        }, 30);

4, offsetParent renvoie le parent de l'objet (parent avec positionnement) similaire à parentNode, lorsqu'il n'y a pas de positionnement, renvoie body

Différence : parentNode doit être le parent, offsetParent Cela peut être papa, grand-père, etc.

5. La différence entre offsetTop, offsetLeft et style.top, style.left

5.1 offsetTop, offsetLeft peut être la position de la boîte non positionnée. depuis le haut ou la gauche

5.2 style.top, style.left Seule la boîte positionnée a le haut ou la gauche

5.3 offsetTop renvoie un nombre, tandis que style.top renvoie Les chaînes, en plus des nombres, ont également des unités : px

5.4 offsetTop est en lecture seule, tandis que style.top peut être lu et écrit

5.5 Si top est non spécifié pour le style de l'élément HTML, alors style.top renvoie une chaîne vide

5.6 style.width ne peut obtenir que la valeur du style en ligne

Recommandations associées :

Solution à la vulnérabilité de contournement causée par la fonctionnalité offset en php

Analyse d'exemples d'offset et de mouvement constant en JS

Le décalage est trop élevé lors de la pagination MySQL Partage de grands exemples d'optimisation SQL

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!