黑马程序员_Dom的window对象的方法和属性

来源：互联网发布：装饰公司网络部编辑：程序博客网时间：2024/05/22 00:54

------- Windows Phone 7手机开发、.Net培训、期待与您交流！ -------

Windows对象的方法：

Windows对象代表当前运行的浏览器窗口。使用windows对象的属性、方法时可以省略window,比如window.alert(‘a’);可以直接写成alert(‘aa’);代表在当前的浏览器窗口中弹出对话框提示aa.

Window中的方法：

alert(‘aa’); 弹出对话框

confirm(); 弹出一个带有“确定”“取消”按钮的对话框，如果按“确定”按钮，返回true,否则返回false.

if (confirm("是否进入？")) {

alert("进入了");

}

else {

alert("取消进入");

}

navigate('Default.aspx') 重新定向到指定的位置。

setInterval();每隔一段时间执行一段代码。第一个参数为要执行的代码，第二个参数为间隔的时间（单位为毫秒）,返回值为定时器的标识，或者说是定时器的id。intervalId=setInterval("alert('hello')", 2000);

clearInterval()取消setInterval的定时执行。因为setInterval可以设定多个计时器，所以清除时需要指定要清楚的那个定时器的标识，即setInterval的返回值。clearInterval(intervalId)

setTimeout（）也是定时执行，但是不会像setInterval一样重复定时执行，而是只执行一次。

setTimeout("alert('这是Timeout')", 2000); 两秒钟后执行一次便不再执行。

clearTimeout也是清除定时。

区分Interval与Timeout：interval是间隔，timeout是超时。

小例子：实现标题的跑马灯效果

思路：

由于是向左滚动，所以滚动一次便是将第一个字符放到最后，把最后的提前，通过window的setInterval（）方法使title每隔一秒就滚动一次，即每隔一秒便将第一个字符挨个往最后放，就实现了向左滚动的效果。

<title>新学期欢迎新同学 </title> //网页的标题

<scripttype="text/javascript">

function scroll() { //在<script></script>中写一个方法，用function定义

var title = document.title; //通过document.title获得网页的标题

var firstch = title.charAt(0); //向左滚动，获取第一个字符或汉字

var leftstr = title.substring(1, title.length);//获得剩下的字符串

document.title = leftstr + firstch; //将字符串进行重新组合，将第一个字符放到了最后

}

setInterval("scroll()", 500); //调用setInterval方法每隔0.5秒将第一个字符向最后移动一次。

</script>

Dom中window对象的常用属性：

Window.location.href=’http://www.itcast.cn’,重新定向到新的地址。和navigate方法效果一样。

还可以通过Window.location.href获得当前页面的地址。alert(location.href)，所以location.href既可取值，也可赋值

Window.location.reload()刷新页面。

Window.event用来获取发生事件时的信息。事件不局限于window对象的属性，所有元素的事件都可以通过event属性渠道相关的信息，类似于winform中的e（EventArg）

altKey属性，bool类型，表示事件发生时是否按下了alt键，类似的还有ctrlKey、shiftKey属性。

clientX、cllientY,screen、screenY,offsetX、offsetY分别代表发生事件时鼠标在客户区的坐标，鼠标在屏幕上的坐标和鼠标相对于事件源的坐标。

returnValue属性，如果设为false,就会取消默认事件的处理。超链接设为false,将禁止访问页面。表单校验时将不会提交到服务器。

<a href="http://www.baidu.com" onclick="alert('禁止访问！'); window.event.returnValue=false">百度</a> //禁止访问页面

<input type="submit" value="提交" onclick="alert('数据有问题');window.event.returnValue=false"/> //禁止提交表单

screen对象：获取屏幕的信息

分辨率：screen.width +screen.height

clipboardData对象：对粘贴板的操作

clearData(“Text”)清空粘贴板里的内容；

getData(“Text”)读取粘贴板的值，返回值为粘贴板中的内容；

setData(“Text”)设置粘贴板中的值。

<input type="button" value="分享给好友" onclick="clipboardData.setData('Text','我发现一个很好玩的网站'+location.href);alert('已经将地址放到粘贴板中');" /> //获取当前的网址并复制到粘贴板中。

<input type="button" value="获取地址" onclick="clipboardData.getData('Text')" /> //获取粘贴板中的值。

当复制的时候body的oncopy方法被触发，直接return false就是禁止复制。

很多元素都有oncopy复制、onpast粘贴事件。

禁止粘贴：<input type="text" onpaste="alert('为保证您的充值正确，禁止粘贴手机号');return false;" />

复制粘贴例子：转载其余网站的内容时，粘贴后会发现最后自动会加上一段文章关于出处的内容。以下是其实现方法：

Js代码：

function modifyClipboard() {

var txt = clipboardData.getData("Text"); //复制后，获取粘贴板中的值

txt = txt + " 本文章转载自传智播客技术社区。文章来源：" + location.href; //获取值后在最后面加上文章的出处和地址。

clipboardData.setData("Text",txt); //重新赋值给粘贴板

}

//用户复制动作发生后0.1秒钟再去修改粘贴板中的内容。100可以随意取值。因为不能直接在oncopy中对粘贴板进行操作，所以设定定时器，复制完成0.1秒后再去修改粘贴板，这样就不在oncopy的执行调用栈上了。

history操作历史记录：

window.history.back()后退；window.history.forward()前进或使用window.history.go(-1)后退、window.history.go(1)前进

document属性：是最复杂的属性之一,以后会有详细说明。