js bom

作者: lucky_yao | 来源:发表于2020-09-30 07:57 被阅读0次

    1:什么是bom?

    bom就是浏览器对象!
    
    简单来说,就是学习一些操作浏览器窗口的方法和属性等!
    

    2:window对象是BOM的核心,也是BOM里面的顶级对象。

    window对象也有很多内置方法(alert(1))
    
    window对象既是ECMAScript规范中的Global对象,也是BOM中的顶级对象;
    
    document对象既是BOM对象的一个属性,也是DOM模型中的顶级核心
    
    location对象既是window对象的属性,同时也是dom对象的属性。
    
    全局变量是 window 对象的属性。
    
    全局函数是 window 对象的方法。
    
    甚至 HTML DOM 的 document 也是 window 对象的属性之一:
    

    3: open('路径','打开的方式','设置属性') 打开窗口

    举例:
    
        _self   当前窗口打开
    
        _blank  新窗口打开
    
        open('img/1.jpg','_self','width=400,height=400,top=100,left=100')
    

    4: close() 关闭窗口

    5: moveTo(x,y) 窗口移动到的位置 窗口移动的尺寸 moveBy(x,y)

    6: 窗口宽高尺寸 resizeTo(x,y) 窗口宽高变化尺寸 resizeBy(x,y)

    7: location 对象提供了与当前窗口中加载的文档有关的信息以及一些导航功能;

    8: navigator 对象用来描述浏览器本身,包括浏览器的名称、版本、语言、系统平台、用户特性字符串等信息.

    9: history 对象保存着从窗口被打开起的历史记录,每个浏览器窗口、标签页、框架都有自己的 history 对象。

    10: 获取浏览器的可视窗口的宽高兼容写法:(主要兼容低版本的IE 8,7,6)

    var h=windowa.innerHeight||document.documentElement.clientHeight||document.body.clientHeight;
    
    var w=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth;
    

    11:屏幕宽高

    document.write("<br />"+window.screen.height);//显示屏的高度
    
    document.write("<br />"+window.screen.width);//显示屏的宽度
    
    document.write("<br />"+window.screen.availHeight);//显示屏的可用高度
    
    document.write("<br />"+window.screen.availWidth);//显示屏的可用宽度
    

    12:获取滚动条的高

    document.documentElement.scrollTop
    
    document.body.scrollTop
    

    兼容写法:

    var sc = document.documentElement.scrollTop + document.body.scrollTop;
    
    var sc = document.documentElement.scrollLeft + document.body.scrollLeft;
    

    13:window.onscroll onscroll:滚动事件

    相关文章

      网友评论

          本文标题:js bom

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