码迷,mamicode.com
首页 > Web开发 > 详细

JS-BOM对象

时间:2018-06-07 14:12:22      阅读:201      评论:0      收藏:0      [点我收藏+]

标签:oca   ring   url   strong   内容   clear   replace   方法   调用   

BOM对象

 

 

  BOM(浏览器对象模型),可以对浏览器窗口进行访问和操作。使用 BOM,开发者可以移动窗口、改变状态栏中的文本以及执行其他与页面内容不直接相关的动作。使 JavaScript 有能力与浏览器“对话”。

 

一、windows对象

  所有的浏览器都支持带对象,因此在使用该对象时可以直接使用,可以使用windows调用,也可以省略。一个HTML文档对应一个windows对象,它被应用于控制浏览器的窗口。

1. 常用的方法

    //方法                              备注

    alert ( )            //显示带有一段消息和一个确认按钮的警告框
    confirm( )           //显示带有一段消息以及确认按钮和取消按钮的对话框
    prompt( )            //显示可提示用户输入的对话框
    setInterval( )       //按照指定的周期(以毫秒计)来调用函数或计算表达式
    clearInterval( )     //取消由 setInterval() 设置的 timeout对象
    setTimeout( )        //在指定的毫秒数后调用函数或计算表达式
    clearTimeout( )      //取消由 setTimeout() 方法设置的 timeout对象
    open( )              //打开一个新的浏览器窗口或查找一个已命名的窗口
    close( )             //关闭浏览器窗口
    scrollTo( )          //把内容滚动到指定的坐标

 

2. 实例

    <body>
    <input type="text" id="id1" onclick="begin()">
    <button onclick="end()">停止</button>
    <script>
        function showTime() { 
            var current_time = new Date().toLocaleString();
            var ele = document.getElementById("id1")
            ele.value = current_time
        }
        var clock1;
        function begin() {
            if (clock1 == undefined) {
                showTime();
                clock1 = setInterval(showTime, 1000)
            }
        }
        function end() {
            clearInterval(clock1);
            clock1 = undefined
        }
    </script>
</body>

 

 

二、history对象

History对象用于记录对用户访问过的URL,它是Windows对象的一部分。它的length属性可以返回浏览器历史列表中的URL数量。

history.forward( )与history.back( )

    //test1.html页面
    <body>
    <a href="test2.html"> 超链接跳转 </a>
    <button onclick="f()"> 按钮跳转 </button>
    <script>
        function f(){
            return history.forward();
        }
    </script>
    </body>

//---------------------------------------------------------------------------------------

    //test2.html页面
    <body>
    <button onclick="f()">返回</button>
    <script>
        function f(){
            return history.back();
        }
    </script>
    </body>

 

 history.go( 1 )与history.go( -1 )

    test1.html页面
    <body>
    <a href="test2.html"> 超链接跳转 </a>
    <button onclick="f()"> 按钮跳转 </button>
    <script>
        function f(){
            return history.go(1);
        }
    </script>
    </body>

//--------------------------------------------------------------------------------------

    test2.html页面
    <body>
    <button onclick="f()">返回</button>
    <script>
        function f(){
            return history.go(-1);
        }
    </script>
    </body>

 

 

三、location对象

 Loacation对象包含当前URL的先关信息。

         //方法                      备注

    location . assign( URL)        //打开URL,注意与replace区别
    location . reload( )           //重载当前页面,即刷新
    location . replace(newURL )    //打开newURL,并覆盖当前页面

 

 

 

 

 

 

JS-BOM对象

标签:oca   ring   url   strong   内容   clear   replace   方法   调用   

原文地址:https://www.cnblogs.com/Lynnblog/p/9149715.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!