Penjelasan terperinci tentang scrollTop dalam kemahiran javascript_javascript

scrollTop mewakili ketinggian tatal Secara lalai, tatal bermula dari kedudukan:0; Ketinggian tatal scrollTop() boleh 'menetapkan' nilai tatal dan 'mendapatkan' nilai tatal.
Apabila nilai tatal ditetapkan, kaedah ini menetapkan nilai tatal untuk semua elemen padanan.
Apabila mendapat nilai tatal, kaedah ini hanya mengembalikan kedudukan tatal elemen padanan pertama.
Untuk mendapatkan nilai scrollTop, anda boleh rujuk kod berikut:

Salin kod Kod adalah seperti berikut:

var scrollTop = document.documentElement.scrollTop ||. window.pageYOfset ||document.body.scrollTop;

1. Perbezaan dalam tatal atas antara penyemak imbas

IE6/7/8:

Untuk halaman tanpa pengisytiharan doctype, anda boleh menggunakan document.body.scrollTop untuk mendapatkan ketinggian scrollTop
Untuk halaman dengan pengisytiharan doctype, anda boleh menggunakan document.documentElement.scrollTop; Safari:
Safari adalah istimewa, ia mempunyai fungsi tersendiri untuk mendapatkan scrollTop: window.pageYOffset; Firefox:
Firefox dan penyemak imbas lain yang agak standard adalah lebih bebas daripada kebimbangan, hanya gunakan document.documentElement.scrollTop ;

2. Dapatkan nilai scrollTop

Dapatkan frasa tugasan scrollTop dengan sempurna:

Salin kod Kod adalah seperti berikut: var scrollTop = document.documentElement.scrollTop ||

Nilai scrollTop boleh diperoleh dalam apa jua keadaan melalui tugasan ini.
Perhatikan tugasan ini dengan teliti, adakah anda perasan sesuatu? ?

Betul, window.pageYOffset (Safari) diletakkan di tengah ||. Kerana apabila nombor 0 ORed dengan undefine, sistem mengembalikan nilai terakhir secara lalai. Iaitu, 0 == undefine dalam operasi OR; Apabila bar skrol halaman hanya di bahagian atas, iaitu apabila nilai skrolTop ialah 0. Di bawah IE, window.pageYOffset (Safari) mengembalikan undefine Pada masa ini, apabila window.pageYOffset (Safari) diletakkan pada penghujung operasi OR, scrollTop mengembalikan undefine. Jika undefine digunakan dalam operasi seterusnya, ralat akan berlaku dilaporkan.

Pelayar lain tidak akan kembali undefine tanpa mengira tugasan scrollTop atau perintah operasi Ia boleh digunakan dengan selamat..
Jadi pada akhirnya ia masih menjadi masalah IE...
Saya agak keliru, saya tidak tahu sama ada saya boleh menyatakan diri saya dengan jelas.
Tetapi akhirnya, saya membuat kesimpulan bahawa ayat ini telah diuji dan OK, jadi anda boleh menggunakannya dengan yakin

Salin kod

Kod adalah seperti berikut: var scrollTop = document.documentElement.scrollTop ||

Arahan berkaitan DTD:

Apabila halaman mempunyai DTD, atau DOCTYPE ditentukan, gunakan document.documentElement.

Apabila halaman tidak mempunyai DTD, atau DOCTYPE tidak dinyatakan, document.body digunakan.

Ini benar dalam IE dan Firefox.

Untuk keserasian, tidak kira sama ada terdapat DTD, anda boleh menggunakan kod berikut:

Salin kod

Kod adalah seperti berikut: var scrollTop = window.pageYOffset //untuk FF ||. document.documentElement.scrollTop ||. document.body.scrollTop ||. 0;

DocumentElement dan arahan berkaitan badan:

body ialah nod anak badan dalam objek DOM, iaitu teg

documentElement ialah akar nod akar keseluruhan pokok nod, iaitu teg

DOM memanggil setiap objek dalam hierarki sebagai nod, yang merupakan struktur hierarki Anda boleh memahaminya sebagai struktur pokok, sama seperti direktori kami, direktori akar, dan terdapat subdirektori di bawah direktori akar di bawah direktori.

Ambil Bahasa Penanda Hiperteks HTML sebagai contoh: satu punca keseluruhan dokumen ialah, yang boleh diakses menggunakan document.documentElement dalam DOM Ia adalah nod akar bagi keseluruhan pepohon nod. Badan ialah nod kanak-kanak Untuk mengakses teg badan, anda harus menulis: document.body dalam skrip.

Jika anda ingin mengklik butang untuk menatal ke bahagian atas halaman, gunakan jquery untuk mengklik dan melaksanakan kod $(document).scrollTop(0) untuk menatal ke atas.

Kedudukan tatal yang sama tatalKe kiri menunjukkan kedudukan tatal ke kiri.

Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.