/*
     * bom:
     *   提供了瀏覽器接口;
     *   w3c為了把javascript最基本的只是標準化已經將bom的主要方面納入html5規範*/
    console.log(window);
    !(function (window) {
        /*自執行函數初始化變量不會給window添加屬性
         *   因為這是局部變量是私有的
         *   雖然這裏面的this指向window*/
        var age = 19;

        function fn() {
            console.log(
 
this.age);

        }

        console.log(age, this.age, window.age);//19,undefined;undefined
        fn()


    })(window)


    console.log(top, parent);//這兩個對象再ongoing框架時有特殊的含義沒有框架時就是window


    !(function () {
        /*窗口位置*///獲取的數值為number
//        相對於屏幕左上位置
        /*screenLeft     screenX
         * screenTop      screenY

         * 
 
*/

        window.onclick = function (event) {
            console.log(event.screenX)
            /*下面是兼容寫法*/
            var leftPos = typeof event.screenX === ‘number‘ ? event.screenX : event.screenLeft;
            var topPos = typeof event.screenY === ‘number‘ ? event.screenY : event.screentop;

        }
        console.log(window.screenLeft 
 
|| window.scrollX);
        /*瀏覽器相對於莊口左上的距離。*/

        /*moveTo()將瀏覽器窗口移動到麽某個位置哦===(這兩個方法被很多瀏覽器禁用了那你還講個毛)*/
        window.moveTo(0, 0);
        window.moveBy(0, 0);
    })()
    !(function () {
        /*窗口大小(視口大小)*/
//        兼容性好多
        /*
         * innerHeight outerHeight ie9+
         *
         * document
         *
         *
         *
         *
         * */
        console.log(document.documentElement.clientHeight || document.body.clientHeight); //
//        console.log(document.body.clientHeight);//谷歌中不可以用（但是其混雜模式可以用）火狐也不可用（混雜模式可以）
        /*resizeTo() resizeBy() 調整屏幕寬高 但已經禁用了*/
    })()
    !(function () {
        /*導航與打開窗口*/
//        window.open(‘url‘, ‘框架名（此參數不是必須）‘);

        window.onclick = function () {
            var win = window.open(‘http://www.baidu.com‘, ‘sss‘, ‘height=400,width=400,left=500,top=400‘);
            win.resizeTo(1000, 100);//改變窗口大小
            win.moveTo(1000, 100);//改變窗口位置
            setTimeout(function () {
                win.close();//關閉彈出的框架 主頁面框架是不可用代碼關閉的
            }, 3000)
//            window.close()
        }

    })()


    !(function () {
//        間歇調用與超時調用
// setInterval()
//  setTimeout()
//        clearInterval()
//        clearTimeout()
    })()

   !(function () {
        /*系統對話框
         *       這些對話框是同步與模態的 彈出時代碼會停止執行 關閉時代碼恢復執行
         * alert()
         * confirm() 返回值為布爾值
         * prompt()
         * */
        /*var result = confirm(‘chichihci‘);
        console.log(result);*/
        var aa=prompt(‘3123‘); //點擊取消返回值為null 點擊確定返回值為輸入值
        console.log(aa);



        /*谷歌瀏覽器特有*/
//        window.print(‘print‘);
        window.find(‘find‘)
    })()

 /*location 是BOM最有用的對象之一
     *   它提供了與當前文檔相關得到信息
     *   還提供了一些導航功能
     *   （ 它既是window的屬性又是document的屬性）
     *

     *
     *
     * */
    console.log(window.location);
    console.log(document.location);
    console.log("hash值" + location.hash);//會生成歷史記錄
    console.log("服務器名稱與端口號" + location.host);
    console.log("不帶端口號的服務器名稱" + location.hostname);
    console.log("完整url" + location.href);//location.toString() 也返回這個值
    console.log("url目錄與文件名" + location.pathname);
    console.log("端口" + location.port);
    console.log("頁面使用的協議" + location.protocol);
    console.log("url查詢的字符串" + location.search);

    /*將location.search轉化為對象*/
    function getdata() {
        var qs = location.search.length > 0 ? location.search.substring(1) : ‘‘;
        args = {};
        var items = qs.length ? qs.split(‘&‘) : [];
        items.map(function (k, v, ele) {
            console.log(k);
            var a = k.split(‘=‘);
//            console.log(a);
            args[a[0]] = a[1]
        });
        console.log(args)

    }
    getdata()


    /*位置操作*/
//    location.assign(‘http://www.baidu.com‘);
    /*location.href=‘url‘ 與 window.location=‘   url‘ 也會以URL調用location.href的屬性
    *
    * */
//    location.replace(‘http://www.baidu.com‘);//這種跳轉是沒有返回的
    setTimeout(function () {
        location.reload();//頁面刷新 （有可能從緩存中獲取）
//        location.reload(true); 頁面刷新 從服務器獲取
    },3000)

  /*navigation
    *    識別客戶端瀏覽器的事實標準
    *
    *
    * */
    console.log(navigator)
    console.log(navigator.userAgent);//可以用來檢測設備類型
    console.log(navigator.plugins);//可以用來檢測有哪些插件

 /*
    *screen 基本上是來表明客戶端的能力包括（不同瀏覽器支持的屬性不一致）
    *   顯示器信息
     *  像素寬高
     *
    * */
    console.log(screen)

   /*history
     用來保存用戶的上網歷史記錄
     history.go()
     *
     * */
console.log(history.length);//存在歷史記錄的數量
    document.querySelector(‘.go1‘).onclick = function () {
//        history.go(1);//前進
        history.forward();//前進

        document.querySelector(‘.go2‘).onclick = function () {
//        history.go(-1)//後退
            history.back();//後退
        }
    }

第八章：BOM