Explication détaillée de la fenêtre JS en JavaScript <2>

Des questions ? Explication détaillée de la fenêtre JS en JavaScript2cc198a1d5eb0d3eb508d858c9f5cbdb

Définition : Fenêtre JavaScript - Modèle d'objet de navigateur
Modèle d'objet de navigateur (BOM)
Modèle d'objet de navigateur (Modèle d'objet de navigateur) n'a pas de norme formelle.
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.


1. Objet Window
Tous les navigateurs prennent en charge l'objet window. Il représente la fenêtre du navigateur.
Tous les objets globaux, fonctions et variables JavaScript deviennent automatiquement membres de l'objet fenêtre.
Les variables globales sont des propriétés de l'objet window.
Les fonctions globales sont des méthodes de l'objet window.
Même le document HTML DOM est l'une des propriétés de l'objet window :

window.document.getElementById("header");

Identique à ceci :

document.getElementById("header");

2.Taille de la fenêtre
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 - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度

Pour Internet Explorer 8, 7, 6, 5 :

document.documentElement.clientHeight
document.documentElement.clientWidth

ou

C'est pour obtenir la longueur et la largeur du corps

document.body.clientHeight
document.body.clientWidth

Par exemple :

	var w = window.innerWidth;
	var h = window.innerHeight;
	/*这个获取的长宽与下列的相同*/
	var w2 = document.documentElement.clientWidth;
	var h2 = document.documentElement.clientHeight;
	/*这得到的是body的长度*/
	var h1 = document.body.clientHeight;
	var w1 = document.body.clientWidth;
	document.getElementById("a1").innerHTML="内部窗口大小为："+w+"*"+h+"   "+w1+"*"+h1+"  "+w2+"*"+h2;

3. 🎜>Quelques autres méthodes :
window.open() - Ouvrir une nouvelle fenêtre

Par exemple :

window.open('1.html','ss');
window.close() - 关闭当前窗口window.moveTo() - 移动当前窗口window.resizeTo() - 调整当前窗口的尺寸

Par exemple :

window.resizeTo(600,600);

4.localtion

l'objet window.location est utilisé pour obtenir l'objet adresse (URL) de la page actuelle et utilisation Le navigateur redirige vers une nouvelle page. L'objet

Window Location
window.location peut être écrit sans le préfixe window.
Quelques exemples :

location.hostname 返回 web 主机的域名
location.pathname 返回当前页面的路径和文件名
location.port 返回 web 主机的端口 （80 或 443）
location.protocol 返回所使用的 web 协议（http:// 或 https://）

Exemples :

document.getElementById("a2").innerHTML="主机名"+location.hostname+" 
 路径:"+location.pathname+" 端口号:"+location.port+"  web协议:"+location.protocol;

Exemple :

document.getElementById("a2").innerHTML="主机名"+location.hostname+"  
路径:"+location.pathname+" 端口号:"+location.port+"  web协议:"+location.protocol+" IRL:"+location.href;

5.Window Location Assign
La méthode location.assign() charge un nouveau document.

Exemple :

window.location.assign("http://www.w3school.com.cn");
window.location.assign("1.html");

6.Window HistoryL'objet window.history n'a pas besoin d'utiliser le préfixe window lors de l'écriture.
Pour protéger la confidentialité des utilisateurs, des restrictions sont imposées aux méthodes JavaScript d'accès à cet objet.
Quelques méthodes :
history.back() - Identique à cliquer sur le bouton Précédent dans le navigateur
history.forward() - Identique à cliquer sur le bouton Suivant dans le navigateur

7. L'objet window.navigator contient des informations sur le navigateur du visiteur. L'objet Window Navigator
window.navigator peut être écrit sans utiliser le préfixe window.
Instance

<p id="example"></p>
<script>
txt = "<p>Browser CodeName: " + navigator.appCodeName + "</p>";
txt+= "<p>Browser Name: " + navigator.appName + "</p>";
txt+= "<p>Browser Version: " + navigator.appVersion + "</p>";
txt+= "<p>Cookies Enabled: " + navigator.cookieEnabled + "</p>";
txt+= "<p>Platform: " + navigator.platform + "</p>";
txt+= "<p>User-agent header: " + navigator.userAgent + "</p>";
txt+= "<p>User-agent language: " + navigator.systemLanguage + "</p>";
document.getElementById("example").innerHTML=txt;

Avertissement : les informations de l'objet navigateur sont trompeuses et ne doivent pas être utilisées pour détecter les versions du navigateur car : les données du navigateur peuvent être modifiées par l'utilisateur du navigateur
Le navigateur ne peut pas signaler les nouveaux systèmes d'exploitation publiés après le navigateur

8. :

Boîte d'alerte : balert("Bonjour encore ! Ici, nous vous montrons " 'n' " comment ajouter un saut de ligne à la boîte d'alerte. ")

确认框:   var r=confirm("Press a button!")  这里的r值，点击确认为true，否则为false

提示框： var name=prompt("请输入您的名字","Bill Gates")前者是提示信息，后者是默认值，name是输入框的返回值

二、JavaScript 计时


通过使用 JavaScript，我们有能力做到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。

JavaScript 计时事件
通过使用 JavaScript，我们有能力作到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。
在 JavaScritp 中使用计时事件是很容易的，两个关键方法是:
setTimeout()
未来的某时执行代码
clearTimeout()
取消setTimeout()

语法：var t=setTimeout("javascript语句",毫秒)

setTimeout("alert('5seconds message!')",5000);//5秒后执行

三、Cookie

什么是cookie?
cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。

有关cookie的例子：
名字 cookie
当访问者首次访问页面时，他或她也许会填写他/她们的名字。名字会存储于 cookie 中。当访问者再次访问网站时，他们会收到类似 "Welcome John Doe!" 的欢迎词。而名字则是从 cookie 中取回的。

密码 cookie
当访问者首次访问页面时，他或她也许会填写他/她们的密码。密码也可被存储于 cookie 中。当他们再次访问网站时，密码就会从 cookie 中取回。

日期 cookie
当访问者首次访问你的网站时，当前的日期可存储于 cookie 中。当他们再次访问网站时，他们会收到类似这样的一条消息："Your last visit was on Tuesday August 11, 2005!"。日期也是从 cookie 中取回的。

<html>
<head>
<script type="text/javascript">
function getCookie(c_name)
{
if (document.cookie.length>0)
  {
  c_start=document.cookie.indexOf(c_name + "=")
  if (c_start!=-1)
    { 
    c_start=c_start + c_name.length+1 
    c_end=document.cookie.indexOf(";",c_start)
    if (c_end==-1) c_end=document.cookie.length
    return unescape(document.cookie.substring(c_start,c_end))
    } 
  }
return ""
}

function setCookie(c_name,value,expiredays)
{
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
}

function checkCookie()
{
username=getCookie(&#39;username&#39;)
if (username!=null && username!="")
  {alert(&#39;Welcome again &#39;+username+&#39;!&#39;)}
else 
  {
  username=prompt(&#39;Please enter your name:&#39;,"")
  if (username!=null && username!="")
    {
    setCookie(&#39;username&#39;,username,365)
    }
  }
}
</script>
</head>

<body onLoad="checkCookie()">
</body>
</html>

 以上就是JavaScript之JS Window详解77d226c7a2080f1d99ea5951bd228e92 的内容，更多相关内容请关注PHP中文网（www.php.cn）！