window事件——JavaScript

window尺寸

有三种方法能够确认浏览器窗口的尺寸（浏览器的窗口、不包括工具栏和滚动条）
对于Internet Explorer、Chrome、Firefox、Opera以及Safari
.window.innerHeight-浏览器窗口的内部高度
.window.innerWidth- 浏览器窗口的内部宽度
对于Internet Explorer 8/7/6/5

document.documentElement.clientHeight
document.ducumentElement.clientWidth

或者：

document.body.clientHeight;
document.body.clientWidth;

window事件

新窗口打开、旧窗口的关闭、窗口位置的移动、窗口的外观设置

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<script type="text/javascript">
	//窗口打开
	function openWin() {
		myWindow = window.open('','','width=200,height=100');
		myWindow.document.write("<p>This is 'myWindow'</p>");
		myWindow.blur();//确保新窗口获得键盘的控制，失去控制.blur();
	}
	//窗口关闭
	function closeWin() {
		myWindow.close();
	}
	//移动窗口到左上角
	function moveWin() {
		myWindow.moveTo(200,0);
		myWindow.focus();
	}
	//调整窗口的宽度
	function changeWin() {
		myWindow.resizeTo(500, 500);
		myWindow.focus();
	}
</script>
<body>
	<input type="button" value="open Window" onclick="openWin()" />
	<input type="button" value="close Window" onclick="closeWin()" />
	<input type="button" value="move Window" onclick="moveWin()" />
	<input type="button" value="change Window" onclick="changeWin()" />
</body>
</html>

Window.Navigator的注意事项

1) window.navigator 对象包含有关访问者浏览器的信息,window.navigator 对象在编写时可不使用 window 这个前缀。

2) 来自navigator对象的信息具有误导性，不应该被用于检测浏览器版本，这是因为：

navigator数据可悲浏览器使用者更改
一些浏览器对测试站点会识别错误
浏览器无法报告晚于浏览器发布的新操作系统

浏览器的检测

由于navigator可误导浏览器检测，使用对象检测可用来嗅探不同的浏览器

由于不同的浏览器支持不同的对象，您可以使用对象来检测浏览器。例如，只有Opera支持属性“window.opera”，您可以据此识别Opera

例如：if ( window.opera ){ ... some action ... };

JavaScirpt Cookie

在一下的实例中，我们将创建一个cookie来存储访问者姓名。首先访问者访问web页面，他将被要求填写自己的名字。该名字存储在cookie中。访问者下次访问页面，他会看到一个欢迎的消息。在这个实例中我们会创建3个JavaScript函数

设置cookie值的函数
获取cookie值的函数
检测cookie值的函数

设置cookie值的函数

首先，我们创建一个用于存储访问者的名字：

function setCookie(cname, cvalue, exdays){
    var d = new Date();
    d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
    var expires = "expires=" + d.toGMYString();
    document.cookie = cname + "=" + cvalue + ";" + expire; 
}

函数解析：

以上的函数参数中，cookie的名称为cname,cookie的值为cvalue,并设置了cookie的过期时间expires。该函数设置了cookie名、cookie值、cookie过期时间

获取cookie值的函数

然后，我们创建一个函数用户返回指定cookie的值：

function getCookie(cname) {
    var name = cname +　"=";
    var ca = document.cookie.split(';');
    for(var i = 0; i<ca.length; i++) {
        var c = ca[i].trim();
        if (c.indexOf(name) == 0) {
            return c.substring(name.length, c.length);
        }     
        return "";  
    }
}

函数解析：

cookie名的参数为cname.
创建一个文本变量用于检索指定cookie：cname + "=";
使用分号来分割document.cookie字符串，并将分割后的字符串数组赋值给ca,(ca = document.cookie.split(";"))，
循环ca数组（i = 0； i<ca.length; i++） ,然后读取数组中的每个值，并出去数组前后空格（c = ca[i].trim()）;
如果找到cookie(c.indexOf(name) == 0), 返回cookie的值（c.substring(name.length, c.length)）;
如果没有找到cookie.则返回“”。

检测cookie值的函数

最后，我们可以创建一个cookie是否创建的函数。
如果设置了cookie，将显示一个问候信息；
如果没有设置cookie,将会显示一个弹窗用于询问访问者的名字，并调用setCookie函数将访问者的名字存储365天

function checkCookie() {
    var username = getCookie("username");
    if(username != "") {
        alert("Welcome again " + username);
    } else {
        username = prompt("Please enter your name: ";"");
        if(username != "" && username != null) {
             setCookie("username", username, 365);
        }
    }
}

完整实例请点击：https://github.com/Cutepingping/Javascript/tree/master/Window进行查看。