Bagaimana untuk mendapatkan ketinggian skrin dengan mudah dengan jQuery

Cara mendapatkan ketinggian skrin dengan mudah menggunakan jQuery

Dalam proses pembangunan web, kadangkala kita perlu mendapatkan ketinggian tetingkap penyemak imbas semasa untuk membuat pelarasan susun atur yang sepadan atau melakukan operasi tertentu. Menggunakan jQuery, anda boleh melaksanakan fungsi mendapatkan ketinggian skrin dengan mudah. Contoh kod khusus diterangkan di bawah.

Mula-mula, perkenalkan perpustakaan jQuery ke dalam fail HTML. Ia boleh diperkenalkan melalui pautan CDN, atau anda boleh memuat turun fail jQuery tempatan dan memperkenalkannya ke dalam projek. Berikut ialah contoh memperkenalkan jQuery melalui pautan CDN:

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

Seterusnya, tulis fungsi untuk mendapatkan ketinggian skrin dalam kod JavaScript. Kod khusus adalah seperti berikut:

$(document).ready(function() {
    // 获取屏幕高度
    var screenHeight = $(window).height();
    
    // 输出屏幕高度
    console.log("屏幕高度：" + screenHeight);
});

Dalam kod di atas, kita mula-mula memperoleh ketinggian tetingkap penyemak imbas semasa melalui kaedah $(window).height() dan tetapkan ia kepada pembolehubah < code>screenHeight . Kemudian ketinggian skrin dikeluarkan melalui kaedah console.log(). $(window).height()方法获取了当前浏览器窗口的高度，并将其赋值给变量screenHeight。然后通过console.log()方法输出了屏幕的高度。

如果想要在页面加载完成后立即获取并展示屏幕高度，可以将上述代码放在$(document).ready()函数中。这样就可以确保DOM加载完成后再执行获取屏幕高度的操作。

当浏览器窗口的大小发生改变时，也可以通过监听resize

Jika anda ingin mendapatkan dan memaparkan ketinggian skrin serta-merta selepas halaman dimuatkan, anda boleh meletakkan kod di atas dalam fungsi $(document).ready(). Ini memastikan bahawa operasi mendapatkan ketinggian skrin dilakukan selepas DOM dimuatkan.

Apabila saiz tetingkap penyemak imbas berubah, anda juga boleh mendapatkan ketinggian skrin terkini serta-merta dengan mendengar acara resize: 🎜

$(window).resize(function() {
    var screenHeight = $(window).height();
    console.log("窗口高度已更新为：" + screenHeight);
});

🎜Dengan contoh kod di atas, kami boleh menggunakan jQuery dengan mudah untuk mendapatkan ketinggian skrin, dan dikemas kini dalam masa nyata apabila diperlukan. Kaedah ini mudah dan mudah digunakan serta sesuai untuk pelbagai senario pembangunan web. 🎜

Atas ialah kandungan terperinci Bagaimana untuk mendapatkan ketinggian skrin dengan mudah dengan jQuery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!