javaweb/javascript/window_object/window_object.html at master · CPU-Code/javaweb · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<!--
 * @由于个人水平有限, 难免有些错误, 还请指点:
 * @Author: cpu_code
 * @Date: 2020-10-18 22:27:41
 * @LastEditTime: 2020-10-18 23:21:38
 * @FilePath: \web\javascript\window_object\window_object.html
 * @Gitee: [https://gitee.com/cpu_code](https://gitee.com/cpu_code)
 * @Github: [https://github.com/CPU-Code](https://github.com/CPU-Code)
 * @CSDN: [https://blog.csdn.net/qq_44226094](https://blog.csdn.net/qq_44226094)
 * @Gitbook: [https://923992029.gitbook.io/cpucode/](https://923992029.gitbook.io/cpucode/)
-->
<!DOCTYPE html>
<html lang="ch">
    <head>
        <meta charset="UTF-8">
        <title>window对象</title>
    </head>

    <body>
        <input id="openBtn" type="button" value="打开窗口">
        <input id="closeBtn" type="button" value="关闭窗口">

        <script>
            /*
            Window：窗口对象
                3. 属性：
                    1. 获取其他BOM对象：
                        history
                        location
                        Navigator
                        Screen:
                    2. 获取DOM对象
                        document
                4. 特点
                    * Window对象不需要创建可以直接使用 window使用。 window.方法名();
                    * window引用可以省略。  方法名();
            */

            // alert()	显示带有一段消息和一个确认按钮的警告框
            alert("cpucode hello");

            window.alert("hello cpu");

            /* confirm()	显示带有一段消息以及确认按钮和取消按钮的对话框。
                * 如果用户点击确定按钮，则方法返回true
                * 如果用户点击取消按钮，则方法返回false
            */
            //确定框
            var flag = confirm("确定退出");

            if(flag){
                //退出操作
                alert("就知道你舍得");
            }else{
                //提示
                alert("小手一抖");
            }
            /*
            prompt()	显示可提示用户输入的对话框。
                            * 返回值：获取用户输入的值
            输入框 */
            var result =  prompt("请输入用户名");
            alert(result);

            //打开新窗口
            var openBtn = document.getElementById("openBtn");
            var newWindow;
            openBtn.onclick = function(){
                // open()	打开一个新的浏览器窗口
                // 返回新的Window对象
                newWindow = open("https://github.com/CPU-Code");
            }

            var closeBtn = document.getElementById("closeBtn");
            closeBtn.onclick = function(){
                // close()	关闭浏览器窗口。
                // 谁调用我 ，我关谁
                newWindow.close();
            }

            //一次性定时器
            /*setTimeout()	在指定的毫秒数后调用函数或计算表达式。
            * 参数：
                1. js代码或者方法对象
                2. 毫秒值
                * 返回值：唯一标识，用于取消定时器
            */
            setTimeout("fun();", 2000);
            var id = setTimeout(fun, 2000);
            // clearTimeout()	取消由 setTimeout() 方法设置的 timeout
            clearTimeout(id);
            function fun() {
                alert("boom----cpucode");
            }

            //循环定时器
            // setInterval()	按照指定的周期（以毫秒计）来调用函数或计算表达式
            var id = setInterval(fun, 2000);
            // clearInterval()	取消由 setInterval() 设置的 timeout
            clearInterval(id);

            //获取history
            var h1 = window.history;
            var h2 = history

            alert(h1);
            alert(h2);

            var openBtn = window.document.getElementById("openBtn");
            alert(openBtn);

        </script>
    </body>
</html>