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

时间:2021-01-19 23:59:15

------- 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("取消进入");

            }

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

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

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

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

setTimeout()也是定时执行,但是不会像setInterval一样重复定时执行,而是只执行一次。

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

clearTimeout也是清除定时。

 区分IntervalTimeoutinterval是间隔,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>

 

 

 

Domwindow对象的常用属性:

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

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

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

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

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

<input type="button" value="点击" onclick="if(window.event.ctrlKey){alert('按下了ctrl');}else{alert('普通点击');}" />

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

clientXcllientY,screenscreenY,offsetXoffsetY分别代表发生事件时鼠标在客户区的坐标,鼠标在屏幕上的坐标和鼠标相对于事件源的坐标。

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

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

<form action="a.aspx">

<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')" />  //获取粘贴板中的值。

当复制的时候bodyoncopy方法被触发,直接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);   //重新赋值给粘贴板

        }

 

<body oncopy="setTimeout('modifyClipboard()',100)"></body>

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

history操作历史记录:

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

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