Rumah hujung hadapan web tutorial js Analisis perbezaan antara offset() dan position() dalam Jquery_jquery

Analisis perbezaan antara offset() dan position() dalam Jquery_jquery

May 16, 2016 pm 04:15 PM
jquery offset position perbezaannya

Artikel ini menganalisis perbezaan antara offset() dan position() dalam Jquery melalui contoh. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

1. offset() dalam Jquery

Dapatkan offset relatif bagi elemen padanan dalam port pandangan semasa. Kedudukan sentiasa dikira secara relatif kepada dokumen, tanpa mengira atribut kedudukan unsur induk atau nenek moyang elemen.
Objek yang dikembalikan mengandungi dua sifat integer: atas dan kiri. Kaedah ini hanya berfungsi pada elemen yang boleh dilihat.

Contohnya:

<!DOCTYPE html> 
<html> 
<head> 
<style> 
p { margin-left:10px; } 
</style> 
<script src="js/jquery.js"></script> 
</head> 
<body> 
 <p>Hello</p><p>2nd Paragraph</p> 
<script>
var p = $("p:last"); 
var offset = p.offset(); 
p.html( "left: " + offset.left + ", top: " + offset.top );
</script> 
</body> 
</html>
Salin selepas log masuk

2. kedudukan() dalam Jquery

Dapatkan offset elemen padanan berbanding dengan elemen induk. Secara umumnya, ia ialah kedudukan unsur induk atau unsur nenek moyang terdekat bagi unsur yang mengandungi kedudukan:relatif. Jika tiada unsur induk atau nenek moyang seperti itu ditemui, kedudukan dikira secara relatif kepada dokumen (iaitu, sudut kiri atas port pandangan Objek yang dikembalikan mengandungi dua sifat integer: atas dan kiri. Untuk pengiraan yang tepat, gunakan unit piksel untuk sifat pengisi, sempadan dan isian.

Contohnya:

<!DOCTYPE html> 
<html> 
<head> 
 <style> 
 div { padding: 15px;} 
 p { margin-left:10px; } 
 </style> 
 <script src="jquery脚本URL"></script> 
</head> 
<body> 
<div> 
 <p>Hello</p> 
</div> 
<p></p> 
<script> 
var p = $("p:first"); 
var position = p.position(); 
$("p:last").text( "left: " + position.left + ", top: " + position.top ); 
</script> 
</body> 
</html>
Salin selepas log masuk

3. Perbezaan antara offset() dan position()

1. Kaedah offset() memperoleh offset relatif bagi elemen padanan dalam tetingkap semasa. Tetingkap di sini merujuk kepada tetingkap halaman semasa, tidak termasuk bar menu penyemak imbas, dll. Sudah tentu, kita tidak perlu menggunakan jquery untuk mengawal keseluruhan pelayar Apa yang kita mahu kawal ialah tetingkap halaman.

2. Kaedah position() memperoleh offset elemen padanan berbanding dengan elemen induk. Iaitu, apa yang diperolehi ialah offset elemen relatif kepada elemen induk terdekat dengan kedudukan mutlak atau kedudukan relatif. Jika semua elemen induk berada dalam mod penentududukan statik lalai, kaedah pemprosesan adalah sama seperti offset(), iaitu offset bagi tetingkap semasa.

3. Apabila menggunakan kaedah position(), jika semua elemen induknya berada dalam mod penentududukan lalai (statik), kaedah pemprosesan adalah sama seperti offset(), iaitu offset relatif bagi tetingkap semasa

4. Menggunakan kaedah offset(), tidak kira bagaimana elemen diletakkan atau elemen induknya diposisikan, offset elemen relatif kepada viewport semasa diperolehi.

5. Dalam keadaan biasa, jika elemen B yang akan dipaparkan disimpan di bawah elemen induk yang sama bagi elemen A (iaitu, B ialah nod adik-beradik A), adalah paling sesuai untuk menggunakan position() pada ini masa; jika elemen B yang akan dipaparkan disimpan di bahagian atas atau bawah DOM (iaitu, elemen induknya ialah badan). Sebaik-baiknya gunakan offset() pada masa ini.

Saya harap artikel ini akan membantu pengaturcaraan jQuery semua orang.

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Perbezaan antara char dan wchar_t dalam bahasa c Perbezaan antara char dan wchar_t dalam bahasa c Apr 03, 2025 pm 03:09 PM

Dalam bahasa C, perbezaan utama antara char dan wchar_t adalah pengekodan aksara: char menggunakan ASCII atau memanjangkan ASCII, WCHAR_T menggunakan unicode; Char mengambil 1-2 bait, wchar_t mengambil 2-4 bait; Char sesuai untuk teks bahasa Inggeris, WCHAR_T sesuai untuk teks berbilang bahasa; CHAR disokong secara meluas, WCHAR_T bergantung kepada sama ada penyusun dan sistem operasi menyokong Unicode; Char adalah terhad dalam pelbagai watak, WCHAR_T mempunyai pelbagai watak yang lebih besar, dan fungsi khas digunakan untuk operasi aritmetik.

Perbezaan antara multithreading dan asynchronous C# Perbezaan antara multithreading dan asynchronous C# Apr 03, 2025 pm 02:57 PM

Perbezaan antara multithreading dan asynchronous adalah bahawa multithreading melaksanakan pelbagai benang pada masa yang sama, sementara secara tidak sengaja melakukan operasi tanpa menyekat benang semasa. Multithreading digunakan untuk tugas-tugas yang berintensifkan, sementara asynchronously digunakan untuk interaksi pengguna. Kelebihan multi-threading adalah untuk meningkatkan prestasi pengkomputeran, sementara kelebihan asynchronous adalah untuk tidak menghalang benang UI. Memilih multithreading atau asynchronous bergantung kepada sifat tugas: tugas-tugas intensif pengiraan menggunakan multithreading, tugas yang berinteraksi dengan sumber luaran dan perlu menyimpan respons UI menggunakan asynchronous.

Apakah fungsi jumlah bahasa C? Apakah fungsi jumlah bahasa C? Apr 03, 2025 pm 02:21 PM

Tiada fungsi jumlah terbina dalam dalam bahasa C, jadi ia perlu ditulis sendiri. Jumlah boleh dicapai dengan melintasi unsur -unsur array dan terkumpul: Versi gelung: SUM dikira menggunakan panjang gelung dan panjang. Versi Pointer: Gunakan petunjuk untuk menunjuk kepada unsur-unsur array, dan penjumlahan yang cekap dicapai melalui penunjuk diri sendiri. Secara dinamik memperuntukkan versi Array: Perlawanan secara dinamik dan uruskan memori sendiri, memastikan memori yang diperuntukkan dibebaskan untuk mengelakkan kebocoran ingatan.

Apakah perbezaan antara char dan char unsigned Apakah perbezaan antara char dan char unsigned Apr 03, 2025 pm 03:36 PM

Char dan Char Unsigned adalah dua jenis data yang menyimpan data aksara. Perbezaan utama adalah cara untuk menangani nombor negatif dan positif: julat nilai: char ditandatangani (-128 hingga 127), dan char unsigned unsigned (0 hingga 255). Pemprosesan Nombor Negatif: Char boleh menyimpan nombor negatif, char yang tidak ditandatangani tidak boleh. Mod Bit: Char Bit tertinggi mewakili simbol, bit unsigned unsigned. Operasi Aritmetik: Char dan Char Unsigned ditandatangani dan tidak ditandatangani, dan operasi aritmetik mereka berbeza. Keserasian: char dan char unsigned

Apakah keperluan asas untuk fungsi bahasa C Apakah keperluan asas untuk fungsi bahasa C Apr 03, 2025 pm 10:06 PM

Fungsi bahasa C adalah asas untuk modularization kod dan bangunan program. Mereka terdiri daripada pengisytiharan (tajuk fungsi) dan definisi (badan fungsi). Bahasa C menggunakan nilai untuk lulus parameter secara lalai, tetapi pembolehubah luaran juga boleh diubahsuai menggunakan lulus alamat. Fungsi boleh mempunyai atau tidak mempunyai nilai pulangan, dan jenis nilai pulangan mestilah selaras dengan perisytiharan. Penamaan fungsi harus jelas dan mudah difahami, menggunakan nomenclature unta atau garis bawah. Ikuti prinsip tanggungjawab tunggal dan pastikan kesederhanaan fungsi untuk meningkatkan kebolehkerjaan dan kebolehbacaan.

c Apakah perbezaan antara tiga kaedah pelaksanaan multithreading c Apakah perbezaan antara tiga kaedah pelaksanaan multithreading Apr 03, 2025 pm 03:03 PM

Multithreading adalah teknologi penting dalam pengaturcaraan komputer dan digunakan untuk meningkatkan kecekapan pelaksanaan program. Dalam bahasa C, terdapat banyak cara untuk melaksanakan multithreading, termasuk perpustakaan thread, Thread Posix, dan Windows API.

Perbezaan antara program H5 dan mini dan aplikasi Perbezaan antara program H5 dan mini dan aplikasi Apr 06, 2025 am 10:42 AM

H5. Perbezaan utama antara program mini dan aplikasi ialah: Senibina Teknikal: H5 adalah berdasarkan teknologi web, dan program mini dan aplikasi adalah aplikasi bebas. Pengalaman dan Fungsi: H5 adalah ringan dan mudah digunakan, dengan fungsi terhad; Program mini adalah ringan dan mempunyai interaktif yang baik; Aplikasi berkuasa dan mempunyai pengalaman yang lancar. Keserasian: H5 adalah serasi, aplikasinya dan aplikasinya yang serasi dengan platform. Kos Pembangunan: H5 mempunyai kos pembangunan yang rendah, program mini sederhana, dan aplikasi tertinggi. Senario yang berkenaan: H5 sesuai untuk paparan maklumat, applet sesuai untuk aplikasi ringan, dan aplikasi sesuai untuk fungsi kompleks.

Cara menetapkan perlindungan kata laluan untuk pdf eksport di ps Cara menetapkan perlindungan kata laluan untuk pdf eksport di ps Apr 06, 2025 pm 04:45 PM

Eksport PDF yang dilindungi kata laluan di Photoshop: Buka fail imej. Klik "Fail" & gt; "Eksport" & gt; "Eksport sebagai PDF". Tetapkan pilihan "Keselamatan" dan masukkan kata laluan yang sama dua kali. Klik "Eksport" untuk menghasilkan fail PDF.

See all articles