20220707_JavaScript对象_BOM_浏览器对象模型_js 2022-07-07转20220707-优快云博客

本文探讨了JavaScript中的浏览器对象模型(BOM)，重点关注Window对象和Location对象的使用。通过实例解析，详细介绍了Window对象作为全局对象的特性，以及Location对象在处理页面URL和导航中的关键作用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本例用到的图片
请添加图片描述

请添加图片描述
window对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>BOM in JS</title>
</head>
<body>

    <input type="button" onclick="on()" value="lightON">
    <img id="lamp" border="0" src="../Files/lightOff.jpg" style="...">
    <input type="button" onclick="off()" value="lightOFF">

    <script>
        //BOM,浏览器对象模型，第一个window对象，alert方法省略
        //confirm return true or false , 确认ture，取消false
        // window.confirm("Are you sure?")
        // confirm("Really sure?")

        // var flag = confirm("for a test")
        // if (flag){
        //     document.write(404)
        // }else {
        //     document.write("still here")
        // }

        //setTimeout & setInterval
        // setTimeout(function (){
        //     alert("this is a test for timeout")
        // },2000)

        // setInterval(function (){
        //     alert("this is a test for interval")
        // },3000)

        function on(){
            document.getElementById("lamp").src='../Files/lightOn.jpg'
        }

        function off(){
            document.getElementById("lamp").src='../Files/lightOff.jpg'
        }
        //让点灯图片没两秒闪一次，用一个自增数字的值控制开关
        //因为开关是两种形态，所以向2取余，如果是三种，向3取余，以此类推
        var i = 0
        // setInterval(function (){
        //     if(i % 2 == 0){
        //         on()
        //     }else {
        //         off()
        //     }
        //     i++
        // },2000)

    </script>

</body>
</html>

location对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Array in JS</title>
</head>
<body>
    <script>
        //location对象，就是地址栏
        var flag = confirm("是否回到首页")
        if (flag){
            document.write("正在返回首页...")
            setTimeout(function (){
                location.href="https://www.google.com"
            },3000)

        }else {
            alert("跳转取消")
            document.write("still here")
        }

    </script>

</body>
</html>