javascript-BOM

時間 2019-12-07
原文原文鏈接
BOM是 Brower Object Model 瀏覽器對象模型,操做瀏覽器部分功能的API,如前進,後退,刷新,滾動BOM結構圖:從上圖也能夠看出：window對象是BOM的頂層(核心)對象，全部對象都是經過它延伸出來的，也能夠稱爲window的子對象。DOM是BOM的一部分。window對象：window對象是JavaScript中的頂級對象。全局變量、自定義函數也是window對象的屬性和方法。window對象下的屬性和方法調用時，能夠省略window。一.彈出系統對話框    alert('')是window.alert('')的簡寫,由於它是window的子方法二.打開窗口,關閉窗口    1.打開窗口語法:window.open('url','target')        url:要打開的地址        target:打開新窗口的位置能夠是_blank,_self,_parent    2.關閉窗口語法:window.close()        注:關閉的是當前窗口,並非打開的新窗口        例:三秒以後打開百度,五秒後關閉            <body>            <script>                setTimeout(function(){                    window.open('http://www.baidu.com','_self')                },3000);                setTimeout(function(){                    window.close()                },5000);            </script>            </body>    3.location對象圖        (1)location.href  跳轉            例:點擊盒子進行跳轉                <head>                    <meta charset="UTF-8">                    <title>Title</title>                    <style>                        div{                            width: 100px;                            height: 100px;                                                    }                    </style>                </head>                <body>                <div id="box">fgdfg</div>                <script>                    var oDiv=document.getElementById('box');                    oDiv.onclick=function(){                        location.href='http://www.baidu.com';                    }                </script>                </body>        (2)location.reload()  從新加載            例:兩秒鐘以後從新加載頁面                <body>                <div id="box">fgdfg</div>                <script>                    setTimeout(function(){                        window.location.reload();                    },2000);                </script>                </body>    4.navigator對象        userAgent:系統瀏,覽器,用來判斷用戶所使用的設備,系統等,不一樣的設備渲染出的頁面不一樣        platform:瀏覽器支持的系統  win/mac/linux            例:                <body>                <div id="box">fgdfg</div>                <script>                    console.log(                        window.navigator                    )                </script>                </body>    5.history對象        (1)後退：            history.back()            history.go(-1)：0是刷新        (2)前進：            history.forward()            history.go(1)            用的很少。由於瀏覽器中已經自帶了這些功能的按鈕：
相關標籤/搜索
javascriptbom
JavaScript
每日一句
每一个你不满意的现在，都有一个你没有努力的曾经。