6.18 js学习笔记

最新推荐文章于 2021-07-08 22:26:09 发布

Shelysure

最新推荐文章于 2021-07-08 22:26:09 发布

阅读量105

点赞数

文章标签： js

本文链接：https://blog.csdn.net/Shelysure/article/details/106841448

版权

js浏览器对象

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <button id="btn" onclick="stopTime()">按钮</button>
    <p id="ptime"></p>
<script>
    var mytime =setInterval(function () {
        getTime();
    },1000);
    function getTime() {
        var d=new Date();
        var t=d.toLocaleTimeString();
        document.getElementById("ptime").innerHTML=t;
    }
    function stopTime() {
        clearInterval(mytime)
    }
</script>
</body>
</html>

在这里插入图片描述

按下按钮后时间停止

在这里插入图片描述
样例

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body onload="myWin()">
    <button id="btn" onclick="stopWin()">按钮</button>
    <p id="ptime"></p>
<script>
  
    var win;
    function myWin() {
        alert("hello");
        win=setTimeout(function () {
        myWin();
        },3000);
    }//3秒调用一次
    function stopWin() {
        clearTimeout(win);
    }
    
</script>
</body>
</html>

在这里插入图片描述

每三秒弹一次，按下按钮后停止执行

history对象

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form>
        <input type="text" id="username">

    </form>
    <button id="btn" onclick="safe()">按钮</button>
    <script>
        function safe() {
            var name=document.getElementById("username").value;
            if(name=="hello"){
                history.go(-1);//返回上个页面
            }
            else {
                alert("输入错误");
            }
        }
    </script>
</body>
</html>

ceshi代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <a href="js%20history对象.html">跳转</a>
</body>
</html>

在ceshi界面点击跳转后输入hello 可跳转回ceshi 否则弹出输入错误

在这里插入图片描述

否则

在这里插入图片描述

location对象

在这里插入图片描述

样例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>location对象</title>
</head>
<body>
<button id="btn" onclick="getLoc()">按钮</button>
<p id="ptime"></p>
    <script>
        function getLoc() {
            // document.getElementById("ptime").innerHTML = window.location.hostname;
            // document.getElementById("ptime").innerHTML = window.location.pathname;
            // document.getElementById("ptime").innerHTML = window.location.href;
            location.assign("写一个网址来跳转")；
        }
    </script>
</body>
</html>

Screen对象

在这里插入图片描述

样例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Screen</title>
</head>
<body>
    <button id="btn" onclick="">按钮</button>
    <p id="ptime"></p>
    <script>
    document.write("可用高度"+screen.availHeight+" 可用宽度"+screen.availWidth);
    document.write("高度"+screen.height+" 宽度"+screen.width);

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

在这里插入图片描述

Shelysure

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
6.18 js学习笔记

js浏览器对象<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <button id="btn" onclick="stopTime()">按钮</button> <p id="ptime">&l
复制链接

扫一扫