Detaillierte Erklärung des JS-Fensters in JavaScript <2>

Frage? Ausführliche Erklärung des JS-Fensters in JavaScript2cc198a1d5eb0d3eb508d858c9f5cbdb

Definition: JavaScript-Fenster – Browser-Objektmodell
Browser-Objektmodell (BOM)
Browser-Objektmodell (Browser-Objektmodell) hat keinen formalen Standard.
Methoden und Eigenschaften werden oft als Stücklisten betrachtet, da moderne Browser (fast) dieselben Methoden und Eigenschaften für die JavaScript-Interaktivität implementiert haben.


1. Fensterobjekt
Alle Browser unterstützen das Fensterobjekt. Es stellt das Browserfenster dar.
Alle globalen JavaScript-Objekte, -Funktionen und -Variablen werden automatisch Mitglieder des Fensterobjekts.
Globale Variablen sind Eigenschaften des Fensterobjekts.
Globale Funktionen sind Methoden des Fensterobjekts.
Sogar das Dokument des HTML-DOM ist eine der Eigenschaften des Fensterobjekts:

window.document.getElementById("header");

Dasselbe:

document.getElementById("header");

2.Fenstergröße
Es gibt drei Methoden, um die Größe des Browserfensters zu bestimmen (das Ansichtsfenster des Browsers, ohne Symbolleisten und Bildlaufleisten).

Für Internet Explorer, Chrome, Firefox, Opera und Safari:

window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度

Für Internet Explorer 8, 7, 6, 5:

document.documentElement.clientHeight
document.documentElement.clientWidth

oder

Dies dient dazu, die Länge und Breite des Körpers zu ermitteln

document.body.clientHeight
document.body.clientWidth

Zum Beispiel:

	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 Andere Fenstermethoden
Einige andere Methoden:
window.open() – Öffne ein neues Fenster

Zum Beispiel:

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

Zum Beispiel:

window.resizeTo(600,600);

4.localtion

window.location-Objekt wird verwendet, um das zu erhalten Adresse (URL) der aktuellen Seite und Verwendung Der Browser leitet auf eine neue Seite weiter.


Window Location
window.location-Objekt kann ohne das Fensterpräfix geschrieben werden.
Einige Beispiele:

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

Beispiele:

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

Beispiel:

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

5.Window Location Assign
Die Methode location.assign() lädt ein neues Dokument.

Beispiel:

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

6.Window History
window.history-Objekt muss beim Schreiben nicht das Fensterpräfix verwenden.
Um die Privatsphäre der Benutzer zu schützen, gelten Einschränkungen für die Zugriffsmethoden von JavaScript auf dieses Objekt.
Einige Methoden:
history.back() – Identisch mit dem Klicken auf die Zurück-Schaltfläche im Browser
history.forward() – Identisch mit dem Klicken auf die Vorwärts-Schaltfläche im Browser

7. Das window.navigator-Objekt enthält Informationen über den Browser des Besuchers.
Window Navigator
window.navigator-Objekt kann ohne Verwendung des Fensterpräfixes geschrieben werden.
Instanz

<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;

Warnung: Informationen aus dem Navigatorobjekt sind irreführend und sollten nicht zur Erkennung von Browserversionen verwendet werden, weil:
Navigatordaten geändert werden können vom Browserbenutzer
Der Browser kann keine neuen Betriebssysteme melden, die später als der Browser veröffentlicht wurden

8 :

Alarmbox: balert("Hallo nochmal! Hier zeigen wir es Ihnen" + 'n' + "Wie man der Alarmbox eine Falte hinzufügt, OK.")

确认框:   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）！