Window对象

下面是Window对象的方法：
window对象代表当前浏览器窗口，使用window对象的属性、方法的时候可以省略window，比如window.alert('a')可以省略成alert('a')。
(1)alert方法，弹出消息对话框
(2)confirm方法，显示“确定”、“取消”对话框，如果按了【确定】按钮，就返回true，否则就false
        if (confirm("是否继续？")) {
            alert("确定");
        }
        else {
            alert("取消");
        }
 
•(3)重新导航到指定的地址：navigate("http://www.rupeng.com");
•(4)setInterval每隔一段时间执行指定的代码，第一个参数为代码的字符串，第二个参数为间隔时间（单位毫秒），返回值为定时器的标识
setInterval("alert('hello')", 5000);
•(5)clearInterval取消setInterval的定时执行，相当于Timer中的Enabled=False。因为setInterval可以设定多个定时，所以clearInterval要指定清除那个定时器的标识，即setInterval的返回值。
var intervalId = setInterval("alert('hello')", 5000);
clearInterval(intervalId);
  
 1 <input type="button" value="滚动" onclick="setInterval('scroll()', 500)" />
 2 每调用一次setInterval都会产生一个新的定时器，并且旧的不会自动停止。所以看起来好像“越跑越快”！
 3 
 4 clearInterval(setInterval('scroll()', 500))，错，不会停止原先的定时器，因为setInterval就产生一个新的定时器，刚产生就被clear。
 5 
 6 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 7 <html xmlns="http://www.w3.org/1999/xhtml" >
 8 <head>
 9     <title>北京欢迎你</title>
10     <script type="text/javascript">
11         var timerId;
12         function scroll() {
13             var title = document.title;
14             var lastCh = title.charAt(title.length - 1); //容易错
15             var leftStr = title.substring(0, title.length - 1);
16             document.title = lastCh + leftStr;
17         }
18         //每调用一次setInterval都会产生一个新的定时器，并且旧的不会自动停止。所以看起来好像“越跑越快”！
19     </script>
20 </head>
21 <body>
22 <input type="button" value="滚动" onclick="if(timerId){clearInterval(timerId);}timerId=setInterval('scroll()', 500)" />
23 <input type="button" value="停止（错误写法）" onclick="clearInterval(setInterval('scroll()', 500))" />
24 <input type="button" value="停止" onclick="clearInterval(timerId)" />
25 </body>
26 </html>
•(6)setTimeout也是定时执行，但是不像setInterval那样是重复的定时执行，只执行一次，clearTimeout也是清除定时。很好区分：Interval：间隔；timeout：超时。
var timeoutId = setTimeout("alert('hello')", 2000);
 
•案例：实现标题栏走马灯的效果，也就是浏览器的标题文字每隔500ms向左滚动一下。提示：标题为document.title属性。实现代码参考备注。
•练习：刚进入的时候还是向左滚动，点击【向左】按钮就向左连续滚动，点击【向右】按钮就向右连续滚动。
–思路1、全局变量，标志当前的滚动方向，当点击向左的时候dir="left",向右dir="right"。
–思路2、scrollleft scroolright,向右滚的时候将scrollleft的Interval clear掉，然后setInterval启动scrollright
  
练习，向右滚动，标题栏走马灯：
        function scrollTitle() {
            var str = document.title;
            str = str.charAt(str.length - 1) + str.substring(0, str.length - 1);
            document.title = str;
        }
        setInterval("scrollTitle()", 500);

思路1
<script type="text/javascript">
        var dir = "left";
        function scroll() {
            var title = document.title;
            if (dir == "left") {
                title = title.substring(1, title.length) + title.charAt(0);
            } else {
                title = title.charAt(title.length - 1) + title.substring(0,title.length-1);
            }
            document.title = title;
        }
        setInterval("scroll()", 1000);

        function turnLeft() {
            dir = "left";
        }
        function turnRight() {
            dir = "right";
        }
        
    </script>

 

•(7)showModalDialog弹出模态对话框，注意showModalDialog必须在onClick等用户手动触发的事件中才会执行，否则可能会被最新版本的浏览器当成广告弹窗而拦截。
–第一个参数为弹出模态窗口的页面地址。
–在弹出的页面中调用window.close()（不能省略window.close()中的window.）关闭窗口，只有在对话框中调用window.close()才会自动关闭窗口，否则浏览器会提示用户进行确认。
•(8)showModelessDialog弹出非模态窗口，参数等和showModalDialog一样。
 
 
posted @ 2013-03-23 14:39  Big.Eagle  阅读(140)  评论(0)    收藏  举报