BOM中window对象的其他方法

BOM中window对象的其他方法

前两篇博客一直在讲window对象的方法，现在将剩下的其他方法以此进行讲解。

HTML代码：

    <button>open()</button>
    <button>close()</button>
    <button>focus()</button>
    <button>print()</button>
    <br>
    <button>resizeTo()</button>
    <button>resizeBy()</button>
    <button>moveTo()</button>
    <button>moveBy()</button>
    <button>scrollTo()</button>
    <button>scrollBy()</button>

CSS代码：

    body{
        height: 2000px;
        width: 2000px;
    }

JS代码：

    // 05window对象其他的方法
    var aBtns = document.getElementsByTagName("button");

    // open(URL,target,"width=100,height=100")	打开一个新的浏览器窗口或查找一个已命名的窗口。  默认在新窗口打开
    aBtns[0].onclick = function () {
        // newWindow = window.open("01简单认识BOM.html", "_blank", "width=300,height=300");
        newWindow = window.open("", "_blank", "width=300,height=300");
        newWindow.focus();
    }
    // close()	关闭浏览器窗口。   只能关闭通过open()方法打开的网页
    aBtns[1].onclick = function () {
        newWindow.close();
    }

    // stop()	停止页面载入。   图片  

    // blur()	把键盘焦点从顶层窗口移开。
    // focus()	把键盘焦点给予一个窗口。
    aBtns[2].onclick = function () {
        newWindow.focus();
    }

    // print()	打印当前窗口的内容。
    aBtns[3].onclick = function () {
        window.print();
    }


    // 针对open()方法打开窗口  不可以含有一个以上的Tab
    // resizeTo(width,height)	把窗口的大小调整到指定的宽度和高度。
    aBtns[4].onclick = function () {
        newWindow.resizeTo(500, 500);
    }
    // resizeBy()	按照指定的像素调整窗口的大小。
    aBtns[5].onclick = function () {
        newWindow.resizeBy(-100,-100);
    }


    // moveTo()	把窗口的左上角移动到一个指定的坐标。
    aBtns[6].onclick = function () {
        newWindow.moveTo(100,100);
    }
    // moveBy()	可相对窗口的当前坐标把它移动指定的像素。
    aBtns[7].onclick = function () {
        newWindow.moveBy(100,100);
    }

    // 滚动条    
    // scrollTo()	把内容滚动到指定的坐标。
    aBtns[8].onclick = function () {
        window.scrollTo(100,100);
    }
    // scrollBy()	按照指定的像素值来滚动内容。
    aBtns[9].onclick = function () {
        window.scrollBy(100,100);
    }
    




    // createPopup()	创建一个 pop-up 窗口。
    // getSelection()	返回一个 Selection 对象，表示用户选择的文本范围或光标的当前位置。
    // getComputedStyle()	获取指定元素的 CSS 样式。
    // matchMedia()	该方法用来检查 media query 语句，它返回一个 MediaQueryList对象。
    // atob()	解码一个 base-64 编码的字符串。
    // btoa()	创建一个 base-64 编码的字符串。

视频讲解链接：
https://www.bilibili.com/video/BV1Ep4y1D77E/