Comment obtenir facilement la hauteur de l'écran avec jQuery

Comment obtenir facilement la hauteur de l'écran à l'aide de jQuery

Dans le processus de développement Web, nous devons parfois obtenir la hauteur de la fenêtre actuelle du navigateur afin d'effectuer les ajustements de mise en page correspondants ou d'effectuer des opérations spécifiques. En utilisant jQuery, vous pouvez facilement implémenter la fonction d'obtention de la hauteur de l'écran. Des exemples de code spécifiques sont décrits ci-dessous.

Tout d'abord, introduisez la bibliothèque jQuery dans le fichier HTML. Il peut être introduit via un lien CDN, ou vous pouvez télécharger un fichier jQuery local et l'introduire dans le projet. Voici un exemple d'introduction de jQuery via un lien CDN :

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

Ensuite, écrivez une fonction pour obtenir la hauteur de l'écran dans le code JavaScript. Le code spécifique est le suivant :

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

Dans le code ci-dessus, nous obtenons d'abord la hauteur de la fenêtre actuelle du navigateur via la méthode $(window).height() et l'attribuons à la variable hauteur de l'écran . Ensuite, la hauteur de l'écran est affichée via la méthode console.log(). $(window).height()方法获取了当前浏览器窗口的高度，并将其赋值给变量screenHeight。然后通过console.log()方法输出了屏幕的高度。

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

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

Si vous souhaitez obtenir et afficher la hauteur de l'écran immédiatement après le chargement de la page, vous pouvez mettre le code ci-dessus dans la fonction $(document).ready(). Cela garantit que l'opération d'obtention de la hauteur de l'écran est effectuée après le chargement du DOM.

Lorsque la taille de la fenêtre du navigateur change, vous pouvez également obtenir instantanément la dernière hauteur d'écran en écoutant l'événement resize : 🎜

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

🎜Avec l'exemple de code ci-dessus, nous pouvons facilement utiliser jQuery pour obtenir la hauteur de l'écran et mise à jour en temps réel en cas de besoin. Cette méthode est simple et facile à utiliser et adaptée à divers scénarios de développement Web. 🎜

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!