JavaScript初探三

 

?
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
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
</head>
<body>
    <ul id="ulList">asdfdasfasdf
        <li>柯震东</li>
        <li>蓝翔技校</li>
        <li>新东方烹饪学校</li>
        <li>北大青鸟</li>
    </ul>
</body>
</html>
<script type="text/javascript">
    var ulObj = document.getElementById("ulList");
    //dom元素.children 获取到所有的子节点(html标签)
    //dom元素.childNodes获取所有的节点,包含文本节点--了解即可,用的不多
    // alert(ulObj.childNodes.length+"|||"+ulObj.children.length);
    //01.获取所有的子节点
    //for (var i = 0; i < ulObj.children.length; i++) {
    //    alert(ulObj.children[i].innerHTML);
    //}
    //02.快速获取老大,老末
    //firstChild获取到的是文本节点--lastChild
    //firstElementChild获取html节点--lastElementChild
    // alert(ulObj.firstChild.textContent);
  //  alert(ulObj.firstElementChild.innerHTML);
    //03.相对定位
    //nextElementSibling获取下一个html节点
    ulObj.firstElementChild.nextElementSibling.style.backgroundColor = "green";
    ulObj.lastElementChild.previousElementSibling.style.backgroundColor = "red";
</script>

　　

?
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
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
    <!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <style type="text/css">
        div {
            border: 1px solid #0094ff;
            width: 400px;
            margin: 10px auto;
            text-align: center;
        }
 
        table {
            border: 1px solid #0094ff;
            border-collapse: collapse;
            width: 400px;
            margin: 10px auto;
            text-align: center;
        }
 
        td {
            border: 1px solid #0094ff;
        }
    </style>
    <script type="text/javascript">
        alert(document.getElementById("textH"));
 
    </script>
</head>
<body>
    <div>
        <input type="button" value="新增菜单" id="btnAddOpt" />
        菜单:
        <select id="selList">
            <option>水煮肉片</option>
            <option>鱼香肉丝</option>
            <option>番茄炒蛋</option>
        </select>
        数量:
        <div id="divNumEdit" style="width: auto; height: auto; padding: 0px; margin: 0px; display: inline-block; border: 0px;">
            <input type="button" value="+" id="btnAddTic" onclick="NumChange(this)" style="cursor: pointer;" />
            <span id="ticketNums">0</span>
            <input type="button" value="-" id="btnSubTic" onclick="NumChange(this)" style="cursor: pointer;" />
        </div>
    </div>
    <div>
        <input type="button" value="新增订单" id="btnAddList" />
    </div>
    <table id="tbList">
        <tr>
            <td>序号</td>
            <td>菜名</td>
            <td>数量</td>
            <td>编辑</td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" class="chkOne" />
                1 </td>
            <td foodindex="0">水煮肉片</td>
            <td>2</td>
            <td><a href="javascript:void(0)">删除</a> <a href="javascript:void(0)" onclick="IntoEdit(this)">编辑</a></td>
            <!--这里传递进去的this 是a标签-->
        </tr>
    </table>
    <div style="text-align: left; padding-left: 2px; width: 396px">
           <input type="checkbox" id="chkAll" /><label for="chkAll">全选</label>
        <a href="javascript:delCheckedTr();">批量选中</a>
    </div>
</body>
</html>
<script type="text/javascript">
    var oldFoodName;//保存开始的菜名
    var oldFoodNum;//保存开始的数量
 
    //----------------封装的方法
    //修改 数量的方法
    function NumChange(inputObj) {
        switch (inputObj.value) {
            case "+":
                //按钮     div       span
                var oldNum = inputObj.parentNode.children[1].innerHTML;
                oldNum++;
                inputObj.parentNode.children[1].innerHTML = oldNum;
                break;
            case "-":
                //按钮     div       span
                var oldNum = inputObj.parentNode.children[1].innerHTML;
                oldNum--;
                oldNum = oldNum < 0 ? 0 : oldNum;
                inputObj.parentNode.children[1].innerHTML = oldNum;
                break;
 
        }
    }
 
    //进入编辑状态
    function IntoEdit(aObj) {
        //根据a标签获取所在的tr
        var editTr = aObj.parentNode.parentNode;
        //修改第二个td 为select标签
        var td01 = editTr.children[1];//获取第二个单元格 索引
        var cloneSelect = document.getElementById("selList").cloneNode(true);//克隆select标签--并且设置select标签的value值
        cloneSelect.value = td01.innerHTML; //获取里面的innerHTML值
        //------------保存原始菜名
        oldFoodName = td01.innerHTML;
        //------------保存原始菜名
        td01.innerHTML = ""; //清空td的innerHTML
        td01.appendChild(cloneSelect);  //将克隆的select标签追加到td里面去
        //修改第三个td为数量编辑框
        var td02 = editTr.children[2]; //获取第三个td的
        var cloneNumEdit = document.getElementById("divNumEdit").cloneNode(true); //克隆数量编辑框
        cloneNumEdit.children[1].innerHTML = td02.innerHTML; //修改数量编辑框里面的数量
        //------------保存原始数量
        oldFoodNum = td02.innerHTML;
        //------------保存原始数量
        td02.innerHTML = ""//清空innerHTML
        td02.appendChild(cloneNumEdit);  //将数量编辑框追加到td02里面去
        //修改第四个td里面的a标签
        var td03 = editTr.children[3];   //获取第四个td/
        //修改innerHTML即可
        td03.innerHTML = "<a href='javascript:void(0)' onclick='SaveEdit(this)'>保存</a> <a href='javascript:void(0)' onclick=' ExitEdit(this)'>取消</a>"
    }
 
 
    //保存修改的方法
    function SaveEdit(aObj) {
        //根据a标签获取所在的tr
        var editTr = aObj.parentNode.parentNode;
        //还原第二个单元格
        var td01 = editTr.children[1]; //获取第二个单元格
        td01.innerHTML = td01.children[0].value;//获取里面select标签的value值  //将value值设置给单元格的innerHTML
        //还原第三个单元格
        var td02 = editTr.children[2]; //获取第三个单元格
        //                 td   div            span    当然可以用id拿 
        td02.innerHTML = td02.children[0].children[1].innerHTML;   //获取里面的span的innerHTML将 innerHTML设置给第三个单元格
        //还原第四个单元格
        var td03 = editTr.children[3];//获取第四个单元格
        td03.innerHTML = "<a href='javascript:void(0)' >删除</a> <a href='javascript:void(0)'onclick='IntoEdit(this)'>编辑</a>";
    }
 
    //推出编辑的方法
    function ExitEdit(aObj) {
        //根据a标签获取所在的tr
        var editTr = aObj.parentNode.parentNode;
        //还原第二个单元格
        editTr.children[1].innerHTML = oldFoodName;//还原原始菜名
        //还原第三个单元格
        editTr.children[2].innerHTML = oldFoodNum;//还原原始
        //还原第四个单元格
        editTr.children[3].innerHTML = "<a href='javascript:void(0)' >删除</a> <a href='javascript:void(0)'onclick='IntoEdit(this)'>编辑</a>";
    }
</script>

　　

网页换肤

?
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
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <link href="css/01.css" rel="stylesheet" id="cssLink" />
</head>
<body>
    <ol>
        <li class="skinChange" style="background-color: red">1</li>
        <li class="skinChange" style="background-color: yellow">2</li>
        <li class="skinChange" style="background-color: blue">3</li>
        <li class="skinChange" style="background-color: green">4</li>
    </ol>
    <div id="picDiv"></div>
    <input type="button" />
</body>
</html>
<script type="text/javascript">
    var liObjs = document.getElementsByClassName("skinChange");
    for (var i = 0; i < liObjs.length; i++) {
        liObjs[i].onclick = function () {
            //获取link标签cssLink
            var linkObj = document.getElementById("cssLink");
            switch (this.innerHTML) {
                case "1":
                    linkObj.href = "css/0" + i + ".css";
                    break;
                case "2":
                    linkObj.href = "css/02.css";
                    break;
                case "3":
                    linkObj.href = "css/03.css";
                    break;
                case "4":
                    linkObj.href = "css/04.css";
                    break;
            }
 
        }
    }
    alert(liObjs[0].onclick);
    //li标签.onclick()
    //function () {
    //    //获取link标签cssLink
    //    var linkObj = document.getElementById("cssLink");
    //    switch (this.innerHTML) {
    //        case "1":
    //            linkObj.href = "css/0" + i + ".css";
    //            break;
    //        case "2":
    //            linkObj.href = "css/0" + i + ".css";
    //            break;
    //        case "3":
    //            linkObj.href = "css/0" + i + ".css";
    //            break;
    //        case "4":
    //            linkObj.href = "css/0" + i + ".css";
    //            break;
 
    //    }
 
</script>

　　

 

简单登陆页面JS特效

?
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
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
</head>
<body>
    <input type="text" id="userName" value="请输入用户名" style="color: #c8c1c1" />
    <br />
    <input type="text" id="userPass" value="请输入密码" style="color: #c8c1c1" />
</body>
</html>
<script type="text/javascript">
    //用户名框获得焦点事件
    document.getElementById("userName").onfocus = function () {
      //  alert(this.style.color);
        if (this.value.trim() == "请输入用户名") {
            //清空自己的文本
            this.value = "";
            //修改自己的字体颜色
            this.style.color = "black";
        }
    }
    //用户名失去焦点事件
    document.getElementById("userName").onblur = function () {
        if (this.value.trim()=="") {
            //还原文本,
            this.value = "请输入用户名";
            //还原样式
            this.style.color = "#c8c1c1";
        }
    }
 
 
    //密码框获得焦点事件
    document.getElementById("userPass").onfocus = function () {
        //  alert(this.style.color);
        if (this.value.trim() == "请输入密码") {
            //清空自己的文本
            this.value = "";
            //修改自己的字体颜色
            this.style.color = "black";
            //修改type
            this.type = "password";
        }
    }
    //密码框失去焦点事件
    document.getElementById("userPass").onblur = function () {
        if (this.value.trim() == "") {
            //还原文本,
            this.value = "请输入用户名";
            //还原样式
            this.style.color = "#c8c1c1";
            //还原type
            this.type = "text";
        }
    }
 
</script>

　　定时器和计时器

?
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
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
</head>
<body>
    <input type="button" value="开启定时器" id="timeOpen" />
    <input type="button" value="关闭定时器" id="timeClose" />
    <input type="button" value="开启计时器" id="interOpen" />
    <input type="button" value="关闭计时器" id="interClose" />
</body>
</html>
<script type="text/javascript">
 
    function eatFood(foodName, bedName) {
        alert("中午吃" + foodName + "在" + bedName + ",睡觉觉");
    }
    function sleep(){
        alert("zzzZZZZZ");
    }
    //-------------分割线
    var timeOutId;//定时器id
    //定时器,延迟调用,只调用一次,延迟时间单位是毫秒
    document.getElementById("timeOpen").onclick = function () {
        //同时接收定时器id
        timeOutId = window.setTimeout(eatFood, 2000, "鸡腿饭,叉烧双拼", "课桌上");
 
    }
    //关闭定时器的方法 通过id
    document.getElementById("timeClose").onclick = function () {
        window.clearTimeout(timeOutId);
    }
 
 
    var interId;
    //计时器,延迟调用,会一直执行,传参的方式 跟定时器一样
    document.getElementById("interOpen").onclick = function () {
        //同时接收定时器id
        interId = window.setInterval(sleep, 1000);
    }
    //通过id关闭计时器
    document.getElementById("interClose").onclick = function () {
        //同时接收定时器id
        interId = window.clearInterval(interId);
    }
</script>

　　自动切换的图片

?
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
115
116
117
118
119
120
121
122
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <style type="text/css">
        div {
            border: 1px solid #0094ff;
            margin: 0 auto;
        }
 
        #divImg {
            width: 300px;
            height: 192px;
        }
 
        #divInfo {
            width: 300px;
            height: 30px;
            margin-top:5px;
        }
 
        li {
            float: left;
            height: 15px;
            width: 25px;
            text-align: center;
            line-height: 15px;
            background-color:#ffd800;
            margin-left:2px;
            color:#ff0000;
        }
 
        ol {
            list-style: none;
            margin:0px;
            padding:0px;
            
        }
    </style>
</head>
<body>
    <div id="divImg" style="position:relative">
        <div style="position:absolute;right:0px;bottom:0px;border:none;padding:0px;margin:0px">
             <ol>
            <li key="button1">1</li>
            <li key="button2">2</li>
            <li key="button3">3</li>
            <li key="button4">4</li>
        </ol>
        </div>
        
    </div>
    <div id="divInfo"></div>
</body>
</html>
<script type="text/javascript">
    //图片信息数据存储
    var imgInfoArr = [
        { "key": "button1", "imgPath": "/img/1.jpg", "imgInfo": "两个小loli" },
        { "key": "button2", "imgPath": "/img/2.jpg", "imgInfo": "嫦娥本月" },
        { "key": "button3", "imgPath": "/img/3.jpg", "imgInfo": "美女与野兽" },
        { "key": "button4", "imgPath": "/img/4.jpg", "imgInfo": "学生装cosplay" }
    ];
    //为数据对象绑定方法--面向对象
    //循环判断传入的key 符合哪一个,返回符合的对象
    imgInfoArr.GetObjByKey = function (key) {
        for (var i = 0; i < this.length; i++) {
            if (this[i].key == key) {
                return this[i];
            }
        }
    }
    //---------------上面是准备数据下面是绑定方法
    //获取所有的li标签
    var liObjs = document.getElementsByTagName("li");
    //为li标签绑定点击事件--通过dom元素.getAttribute("属性名")可以获取自定义属性
    for (var i = 0; i < liObjs.length; i++) {
        liObjs[i].onclick = function () {
            //获取自定义属性 key
            var myKey = this.getAttribute("key");
            //通过key去获取对象
            var imgInfoObj = imgInfoArr.GetObjByKey(myKey);
            //将对象的属性设置给 图片div 还有文字div
            //修改背景图片
            document.getElementById("divImg").style.backgroundImage = "url(" + imgInfoObj.imgPath + ")";
            //修改文字
            document.getElementById("divInfo").innerHTML = imgInfoObj.imgInfo;
 
        }
    }
 
    //全局变量--li标签 索引
    var liIndex = 0;
 
 
    //开启计时器,自动调用图片切换方法
    setInterval(autoClick, 2000);
    //手动调用 自动点击方法.让第一个li标签被点击
    autoClick();
    //封装的方法,
    function autoClick() {
        //手动调用li标签的点击事件
        liObjs[liIndex].onclick();
        //所应增加,并且判断是否越界
        liIndex++;
        liIndex = liIndex > 3 ? 0 : liIndex;
    }
 
    ////根据key获取 对象的方法
    //function GetImgObj(key) {
    //    for (var i = 0; i < imgInfoArr.length; i++) {
    //        if (imgInfoArr[i].key == key)
    //        {
    //            return imgInfoArr[i];
    //        }
    //    }
    //}
    //var someObj=GetImgObj("button3");
    //alert(someObj.key+"|"+someObj.imgPath+"|"+someObj.imgInfo);
 
</script>

　　

?
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
<!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">
        //window.onclick = function () {
        //    alert("你点击了页面");
        //}
       
        //页面资源加载完毕
        //html+css+js解析完毕
        //图片,视频,音频,加载完毕
        window.onload = function () {
            alert("资源加载完毕");
            document.getElementById("12");
            //haha = document.getElementById("123");
            //给body加点击事件
            //body的作用域,跟他的大小有关,
            //body的本质是一个div,大小跟自己内部的元素有关
            //所有要让整个页面都为时间触发区域,就添加给window对象
            document.body.onclick = function () {
                alert("你点击了body");
            }
 
 
        }
      
    </script>
</head>
<body style="background-color:#00e0ff;border:1px solid #0094ff;">
    <br />
    <br />
    <br />
</body>
</html>

　　

?
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
<!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">
        alert("稍等一会");
        //获取当前页面的地址--window.location可读可写
        //alert(window.location);
        //window.location = "http://www.baidu.com";
        //关闭打开页面
        //window.close();
        //打开新的页面不常用.了解即可
        //window.open("p04登录页面demo.html");
        //为window对象添加鼠标移动事件
        window.onload = function () {
            //window添加鼠标移动事件
            window.onmousemove = function () {
                //alert("123");
                //window.innerHeight 获取显示区域的尺寸
                document.getElementById("showInfo").value = window.innerHeight + "|" + window.innerWidth;
            }
        }
 
 
    </script>
</head>
 
<body>
    <input type="text" id="showInfo" />
</body>
</html>

　　

 

 

?
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
<!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">
        //window.parent获取父窗体
        //window.top获取顶级窗体
 
        window.onload = function () {
            //为按钮1添加点击事件
            document.getElementById("btnFather").onclick = function () {
                //自己  父窗体 
                window.parent.document.body.style.backgroundColor = "orange";
                 
            }
            document.getElementById("btnTop").onclick = function () {
                //   window.top.document.body.style.backgroundColor = "pink";
                window.parent.parent.document.body.style.backgroundColor = "pink";
            }
        }
 
    </script>
</head>
<body style="background-color: #0094ff">
    <h1>我是最底层的页面</h1>
    <input type="button" value="修改父窗体颜色" id="btnFather" />
    <input type="button" value="修改顶级窗体颜色" id="btnTop" />
</body>
</html>

　　

?
1
2
3
4
5
6
7
8
9
10
11
12
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body style="background-color:#ffdb00">
    <h1>我是parent页面
    </h1>
    <iframe src="p09_self.html"></iframe>
</body>
</html>

　　

 

?
1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body style="background-color:#f00">
    <h1>我是top页面</h1>
    <iframe src="p09_parent.html" style="height:500px;width:500px;"></iframe>
</body>
</html>

　　

创建table的快捷方式

?
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
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <style type="text/css">
        table {
        border:1px solid #0094ff;
        border-collapse:collapse;
        width:400px;
        margin:0 auto;
        }
        td {
          border:1px solid #0094ff;
          text-align:center;
 
        }
    </style>
    <script type="text/javascript">
        var foodArr = [
            { "name": "杨枝甘露", "price": 15 },
            { "name": "天地一号", "price": 5 },
            { "name": "特仑苏", "price": 8 },
            { "name": "脉动", "price": 4 }
        ]
 
 
        window.onload = function () {
            //村代码生成table
            var tbList = document.createElement("table");//创建table
            //循环对象数组,生成行列
            for (var i = 0; i < foodArr.length; i++) {
                var trCreate = tbList.insertRow();//快速插入tr 同时放回tr的引用
                for (var item in foodArr[i]) {
                    var tdCreate = trCreate.insertCell();//快速插入td 同时返回引用
                    tdCreate.innerHTML = foodArr[i][item];
                }
            }
            document.body.appendChild(tbList); //table加到dom树里面去
        }
 
    </script>
</head>
<body>
</body>
</html>

　　

 

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<!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">
        //window  linux macos
        //window对象里面的 navigator的 属性可以获取一些系统信息,浏览器信息等
        //alert(window.navigator.platform);
        //window.screen/
        //availHeight浏览器可用显示区域 美工可以根据浏览器的显示大小,对页面进行优化
        // alert(window.screen.availHeight + "||" + window.screen.availWidth);
        //历史记录 history.length 获取历史记录的长度
        alert(window.history.length);
    </script>
</head>
<body>
    <a href="p12historyLength.html">点击跳转</a>
</body>
</html>

　　

 

posted @   枫伶忆  阅读(358)  评论(0)  编辑  收藏  举报
编辑推荐：
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
阅读排行：
· 周边上新：园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源！
· 分享 3 个 .NET 开源的文件压缩处理库，助力快速实现文件压缩解压功能！
· Ollama——大语言模型本地部署的极速利器
· DeepSeek如何颠覆传统软件测试？测试工程师会被淘汰吗？
点击右上角即可分享
微信分享提示
AI IDE Trae