下面主要介绍与window对象相关的几个小功能，以我们平时在网站中常见的一些效果作为实例。
首先要知道window对象代表当前浏览器窗口，使用window对象的属性、方法时可以省略前面的“window .”,例如一般将window.alert(‘ ’)直接写为alert( )。
1. 操作定时器
a) 有两种选择：
Ø setInterval( hander , timeout );每隔一段时间执行指定的代码，相当于计时器Timer控件。
Ø setTimeout( hander , timeout );与上面的方法原理相似，但指定的代码只执行一次，不会像上面方法那样不停的重复执行。
b) 下面以setInterval方法为例进行介绍：
Ø 第一个参数为要计时执行的代码，第二个参数为间隔的时间（单位毫秒）；返回值为计时器的唯一标识。
Ø 要取消定时器，用clearInterval（id）,它与setInterval是相对的。每开启一个定时器，就会返回一个与之对应的唯一的id，而要停止定时器就必须要用的此id，即clearInterval（id）。
例如：开启定时器 var interId=setInterval(“alert(‘hello’)”,1000);
关闭定时器clearInterval（interId）
c) 实例—常见的“走马灯效果”：
下面简单的实现网页“标题栏的走马灯效果”，即网页的标题每隔500ms向右滚动一下。代码如下：
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>北京欢迎你</title>
<script type="text/javascript">
function scroll() {
var title = document.title;//取得网页标题title
var firstChar = title.charAt(0);//取得标题第一个文字
var leftChars = title.substring(1, title.length );//取得标题其它文字
document.title = leftChars + firstChar;//将第一个文字，置于标题的最后
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<%--点击"开始滚动"则开启定时器，每隔500s执行一次scroll函数(需要注意，每点击一次都会开启一个新的定时器)--%>
<input type="button" value="开始滚动" onclick="timeId=setInterval('scroll()',500);" />
<%--点击"停止滚动"则清除上面的定时器--%>
<input type ="button" value ="停止滚动" onclick ="clearInterval(timeId);" />
</div>
</form>
</body>
</html>
2. 操作粘贴板
a) 需要操作的是clipboardData对象(下面的“Text”是固定的，不能设为其它值)
Ø setData(“Text”,data)，设置粘贴板的值
Ø getData(“Text”)，读取粘贴板的值
Ø clearData(“Text”)，清空粘贴板.
b) 在某些时候，我们还经常使用“禁止复制”、“禁止粘贴”的功能：
Ø 只需要将元素的oncopy、onpaste事件的值设为”return false”即可，例如:
这样无论“右击-复制”还是ctrl+c都无法进行复制。
c) 实例-1
点击“黏贴板测试”则将粘贴板的值设为"黏贴板测试,hello world"；点击“复制网址”则将其内容设为，本网页的地址。源码如下：
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript">
function test1() {
//alert(window.screen.width + " " + window.screen.height + " " + location.href);
clipboardData.setData("Text", location.href);
alert("成功复制URL");
}
function test2() {
clipboardData.setData("Text", "黏贴板测试,hello world");
alert(clipboardData.getData("Text"));
}
</script>
</head>
<body oncopy="alert('禁止复制');return false">
<form id="form1" runat="server">
<div>
<input type ="button" value ="复制网址" onclick="test1()" />
<input type ="button" value ="黏贴板测试" onclick="test2()" />
</div>
</form>
</body>
</html>
d) 实例-2
为了防止一些人在复制自己的文章时，不添加文章来源，自动再复制的内容后面添加版权声明。源码：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>粘贴板测试2</title>
<script type ="text/javascript" >
function modifyClipboard() {
var txt = clipboardData.getData("Text");
txt = txt + "本文来自……技术网站" + window.location.href;
clipboardData.setData("Text", txt);
}
</script>
</head>
<!--注意，不能在oncopy中执行对粘贴板的操作，因此设定定时器，0.1秒后执行-->
<body oncopy="setTimeout('modifyClipboard()',100);">
<p>kobe bryant never stop trying!</p>
</body>
</html>
（复制-粘贴后的）结果：
3. 操作历时记录
a) 功能函数（相当于）
Ø window.history.back() 后退一页
Ø window.history.forward() 前进一页
Ø window.history.go(int i)前进或后退i页,例如：
window.history.go(-1) 后退一页
window.history.go(1) 前进一页
b) 实例
4. window.event
a) 功能举例
Ø window.event非常重要。它用来获得发生事件时的信息，事件不局限于window对象的事件，所有元素的事件都可以通过event属性取到相关信息。就像winForm中的参数e(EventArg).例如：
Ø altKey属性（bool类型）表示事件发生时是否按下了alt键，类似的还有ctrlKey、shiftKey。如：onclick=”if(event.altKey){alert(‘Alt点击’)}else{alert(‘普通点击’)}”。
Ø clientX、clientY发生事件时鼠标在客户区的坐标;screenX、screenY获得发生事件时鼠标在屏幕上的坐标；offsetX、offsetY获得发生事件时鼠标相对于事件源（比如点击按钮时触发onclick）的坐标。
Ø returnValue属性，如果将returnValue设为false，就会取消默认事件的处理。
Ø srcElement,获得事件源对象（很重要）。
Ø keyCode,获得发生事件时的按键值。
Ø button，发生事件时鼠标按键，1为左键，2为右键，3为左右键同时按下。例，<body onmousedown=”if(event.button==2){alert(‘禁止复制’);}”>
b) 实例—以操作srcElement为例
实现这么一个小功能：如下图，一排按钮的默认Value为“点我啊”，当鼠标点击某个按钮时就将其Value设置为“还点我”。
源码：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type ="text/javascript" >
function initial() {
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
var input = inputs[i];
input.onclick = btnClick;//注意为onclick事件赋值时时不能加“（）”，否则返回的为此函数的返回值
}
}
function btnClick() {
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
//如果被点击的按钮为事件源，则改变它的value值
if (inputs[i]==window.event.srcElement) {
inputs[i].value = "还点我";
}
else {
inputs[i].value = "点我啊";
}
}
}
</script>
</head>
<body onload="initial()">
<input type ="button" value ="点我啊" />
<input type ="button" value ="点我啊" />
<input type ="button" value ="点我啊" />
<input type ="button" value ="点我啊" />
<input type ="button" value ="点我啊" />
</body>
</html>
总结
很多小功能曾经很频繁的在浏览网站时看到--如何架广告，网站数据统计（CNZZ）,禁用复制、粘贴等等。现在自己也都可以亲手实现，感觉现在对网站前端（html、js等）的东西越来越熟悉。