Comment obtenir la position de l'élément actuel dans jquery-connaissance HTML-php.cn

Comment obtenir la position de l'élément actuel dans jquery

藏色散人

Libérer： 2018-12-27 11:02:53

original

9066 Les gens l'ont consulté

jquery obtient la position de l'élément actuel, et elle est relative à la position du document. Nous pouvons utiliser la méthode jQuery offset() pour y parvenir. La méthode offset() ne fonctionne que sur les éléments visibles.

Comment obtenir la position de l'élément actuel dans jquery

Ci-dessous, nous combinons du code simple pour vous présenter comment jquery obtient la position de l'élément actuel.

L'exemple de code est le suivant :

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jquery获取当前元素的位置</title>
<style type="text/css">
*{
margin：0;
padding:0;
}
    #box{
        width:150px;
        height:100px;
        background: orange;
        margin: 150px 100px;
    }
</style>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
    $(function() {
        $("button").click(function(){
            var offset = $("#box").offset();
            alert("盒子的当前位置为: (left: " + offset.left + ", top: " + offset.top + ")");
        });
    });
</script>
</head>
<body>
    <button type="button">获取位置</button>
  
</body>
</html>

Copier après la connexion

La méthode offset() renvoie ou définit le décalage (position) de l'élément correspondant par rapport au document.

La méthode .offset() nous permet de récupérer la position actuelle d'un élément par rapport au document (en particulier son cadre de délimitation, qui exclut les marges). Comparez cela avec .position(), qui récupère la position actuelle par rapport au parent décalé. .offset() est plus utile lors d'opérations globales (en particulier lors de l'implémentation du glisser-déposer) lors du placement de nouveaux éléments au-dessus d'éléments existants.

.offset() renvoie un objet contenant les attributs en haut et à gauche.

Obtenez la position de l'élément actuel. Les résultats sont les suivants :

Comment obtenir la position de l'élément actuel dans jquery