Heim >Web-Frontend >js-Tutorial >JQuery erhalten Koordinaten des Elements

JQuery erhalten Koordinaten des Elements

尊渡假赌尊渡假赌尊渡假赌
尊渡假赌尊渡假赌尊渡假赌Original
2025-02-27 09:03:11874Durchsuche

jQuery get coordinates of element

So verwenden Sie JQuery, um Elementkoordinaten

zu erhalten

jQuery bietet eine Vielzahl von Möglichkeiten, um Koordinateninformationen von Elementen zu erhalten.

1. Offset Parent Element bezieht sich auf das nächste Vorfahrenelement mit einer Nicht-Positionierungsmethode. .position() 2. static

<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>

Hinweis: Die Funktion ist nicht effizient, da sie JQuery -Kettenoperationen unterbricht. .offset() left häufig gestellte Fragen zu JQuery -Koordinaten und -Arements (FAQ) top

<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: Wie kann ich JQuery verwenden, um die Koordinaten eines Elements relativ zu einem Dokument zu erhalten?

getCoord() Verwenden Sie die Methode . Diese Methode gibt ein Objekt zurück, das

bzw.
<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>
Eigenschaften enthält, die die vertikalen und horizontalen Positionen eines Elements in Bezug auf das Dokument darstellen.

getCoord() Q2: Was ist der Unterschied zwischen

und

Methoden in jQuery?

Gibt die Koordinaten eines Elements relativ zu seinem Offset -übergeordneten Element zurück.

.offset() Q3: Wie setzen Sie die Koordinaten eines Elements mit JQuery fest? top left

Verwenden Sie die Methode
<code class="language-javascript">var position = $("#element").offset();
console.log("元素位于: " + position.left + ", " + position.top);</code>
, um ein Objekt zu kombinieren, das die Attribute

und enthält. .position() .offset()

Q4: Wie kann ich JQuery verwenden, um die absoluten Koordinaten eines Elements zu erhalten?

.position() .offset() Verwenden Sie die Methode

, um die absoluten Koordinaten des Elements zu erhalten (relativ zum Dokument).

Q5: Wie kann ich JQuery verwenden, um die Koordinaten eines Elements in Bezug auf sein übergeordnetes Element zu erhalten?

.offset() Verwenden Sie die Methode top. left

Das obige ist der detaillierte Inhalt vonJQuery erhalten Koordinaten des Elements. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn