jQuery obtient des coordonnées d'élément

comment utiliser jQuery pour obtenir des coordonnées d'élément

jQuery fournit une variété de façons d'obtenir des informations coordonnées sur les éléments.

1. L'élément parent offset fait référence à l'élément d'ancêtre le plus proche avec une méthode de positionnement non .position(). static 2.

<code class="language-javascript">var pos = $('#wrapper').position();
console.dir(pos);
// 输出：left: 0, top: 20</code>

3. .offset() 4.

<code class="language-javascript">var offset = $('#wrapper').offset();
console.dir(offset);
// 输出：left: 70, top: 40</code>

Remarque: .offset() La fonction n'est pas efficace car elle interrompt les opérations de la chaîne jQuery. left top Les questions fréquemment posées sur les coordonnées et éléments de jQuery (FAQ)

<code class="language-javascript">var elem = $("#wrapper");
var x = elem.offset().left;
var y = elem.offset().top;
console.log('x: ' + x + ' y: ' + y);
// 输出：x: 70 y: 40</code>

Q1: Comment utiliser jQuery pour obtenir les coordonnées d'un élément par rapport à un document? getCoord() Utilisez la méthode

. Cette méthode renvoie respectivement un objet contenant des propriétés

<code class="language-javascript">jQuery.fn.getCoord = function() {
  var elem = $(this);
  var x = elem.offset().left;
  var y = elem.offset().top;
  console.log('x: ' + x + ' y: ' + y);
  // 输出：x: 70 y: 40
  return {
    "x": x,
    "y": y
  };
};

$('#wrapper').getCoord();
// 输出：Object { x: 70, y: 40 }</code>

et

représentant les positions verticales et horizontales d'un élément par rapport au document. getCoord()

Q2: Quelle est la différence entre les méthodes

et

dans jQuery?

Renvoie les coordonnées d'un élément par rapport à son élément parent décalé;

renvoie les coordonnées d'un élément par rapport au document. .offset() top left Q3: Comment définir les coordonnées d'un élément à l'aide de jQuery?

<code class="language-javascript">var position = $("#element").offset();
console.log("元素位于: " + position.left + ", " + position.top);</code>

Utilisez la méthode pour combiner un objet contenant les attributs .position() et .offset().

.position() Q4: Comment utiliser jQuery pour obtenir les coordonnées absolues d'un élément? .offset()

Utilisez la méthode pour obtenir les coordonnées absolues de l'élément (par rapport au document).

Q5: Comment utiliser jQuery pour obtenir les coordonnées d'un élément par rapport à son élément parent? .offset() top left Utilisez la méthode

.

<code class="language-javascript">$("#element").offset({ top: 100, left: 200 });</code>

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!