Modèle objet du navigateur (BOM)
Il n'existe pas de norme formelle pour le modèle objet du navigateur (BOM).
Les méthodes et propriétés sont souvent considérées comme des nomenclatures puisque les navigateurs modernes ont implémenté (presque) les mêmes méthodes et propriétés pour l'interactivité JavaScript.
objet fenêtre
Lorsque le navigateur ouvre un document, il crée un objet fenêtre, c'est-à-dire que l'objet fenêtre représente la fenêtre ouverte dans le navigateur.
L'objet window est un objet global, et les propriétés de la fenêtre peuvent être utilisées comme variables globales. Par exemple, vous pouvez simplement écrire un document au lieu de window.document. De même, vous pouvez utiliser les méthodes de l'objet window actuel comme fonctions, par exemple simplement écrire alert() au lieu de Window.alert().
Si le document contient des cadres, le navigateur crée un objet fenêtre pour le document et un objet fenêtre supplémentaire pour chaque cadre.
Conseil : bien qu'il n'existe pas de norme claire pour l'objet window, tous les navigateurs le prennent en charge.
Le document du HTML DOM est aussi un des attributs de l'objet window :
window.document.getElementById("header");
Identique à ceci :
document.getElementById("header");
Taille de la fenêtre
Là Il existe trois méthodes pour déterminer la taille de la fenêtre du navigateur (la fenêtre d'affichage du navigateur, à l'exclusion des barres d'outils et des barres de défilement).
Pour Internet Explorer, Chrome, Firefox, Opera et Safari :
window.innerHeight - La hauteur intérieure de la fenêtre du navigateur
window.innerWidth - La largeur intérieure de la fenêtre du navigateur
Pour Internet Explorer 8, 7, 6, 5 :
document.documentElement.clientHeight
document.documentElement.clientWidth
ou
document.body.clientHeight
document.body.clientWidth
Solution JavaScript pratique (couvre tous les navigateurs) :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p id="demo"></p>
<script>
var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
x=document.getElementById("demo");
x.innerHTML="浏览器window宽度: " + w + ", 高度: " + h + "。"
</script>
</body>
</html>Autres méthodes Window
Quelques autres méthodes :
window.open() - Ouvrir une nouvelle fenêtre
window.close() - Fermer la fenêtre actuelle
window.moveTo() - Déplacer la fenêtre actuelle
window.resizeTo() - Ajuster la taille de la fenêtre actuelle
section suivante