BOM-浏览器对象模型

作者: 相关函数 | 来源:发表于2017-11-15 11:29 被阅读48次

    Window

    window对象表示浏览器中打开的窗口.

    • confirm 确认弹窗
      funcation testConfirm() {
          var a = window.confirm('是否退出');
           if(a){
                window.close();
            }else{
                window.alert('hhhh');
            }
      }
    
    • prompt

    prompt(text,defaultText)
    text 表示提示内容
    defaultText表示默认显示内容

      function testPrompt() {
        var a = window.prompt('请输入密码','123');
        alert(a);
      }
    
    • move&&resize 改变窗口的位置和大小
      function testMoveBy() {
        window.moveBy(50,50);
      }
    
      function testMoveTo() {
        window.moveTo(250,250);
      }
    
      function testResizeBy() {
        window.resizeBy(50,50)
      }
    
      function testResizeBy() {
        window.resizeTo(350,350);
      }
    

    经测试chrome浏览器不支持move和resize.

    scrollBy()和scrollTo()的用法类似move和resize.

    • open

    window.open(URL,name,features,replace)
    URL : 如果不是空的就打开相应URL的窗口 反之则打开一个空白窗口
    name : 新窗口的名称, 若该参数指定了一个已经打开的窗口,则open方法不会再打开新窗口,只是指定对窗口的引用,这样features参数将会被忽略.
    features :
    replace : true-url替换浏览历史中的当前条目,false-url在浏览历史中创建新的条目.

    • setInterval&&clearInterval

    setIntval方法可以按照指定的周期(ms)来调用指定的函数或者表达式.指导clearInterval方法被调用或者window被close.
    clearInterval方法可取消由setInterval创建的timeout,它的参数必须是由setInterval创建的ID;

    <!DOCTYPE html>
    <html>
    <head>
        <title>JOE</title>
        <script type="text/javascript">
            var i = window.setInterval('time()', 50);
            function time() {
                var t = new Date();
                document.getElementById('time1').innerHTML = t;
            }
    
        </script>
        </head>
    <body>
        <p id='time1'></p>
        <input type="button" value="stop" onclick="javascript:window.clearInterval(i)" />
    
    </body>
    </html>
    

    Navigator

    navigator包含浏览器的信息.

      with(navigator){
                document.write('<p>appCodeName:'+appCodeName+'</p><br/>');
                document.write('<p>appName:'+appName+'</p><br/>');
                document.write('<p>appVersion:'+appVersion+'</p><br/>');
                document.write('<p>cookieEnabled:'+cookieEnabled+'</p><br/>');
                document.write('<p>onLine:'+onLine+'</p><br/>');
                document.write('<p>platform:'+platform+'</p><br/>');
                document.write('<p>userAgent:'+userAgent+'</p><br/>');
      }
    

    Screen

    screen对象包含客户端显示的屏幕信息.

    History

    • back()
      加载history列表中的前一个url

    • forward()
      加载history列表中的下一个url

    • go()
      加载history列表中的具体的那一个url, 传-1代表前一个, 1 代表下一个, 0是当前,一次类推.

    Location

    location对象包含有关当前url的信息.

      with(location){
                document.write('<p>hash:'+hash+'</p><br/>');
                document.write('<p>host:'+host+'</p><br/>');
                document.write('<p>hostname:'+hostname+'</p><br/>');
                document.write('<p>href:'+href+'</p><br/>');
                document.write('<p>pathname:'+pathname+'</p><br/>');
                document.write('<p>port:'+port+'</p><br/>');
                document.write('<p>protocol:'+protlcol+'</p><br/>');
                document.write('<p>search:'+search+'</p><br/>');
      }
    

    相关文章

      网友评论

        本文标题:BOM-浏览器对象模型

        本文链接:https://www.haomeiwen.com/subject/bblcvxtx.html