• 浏览器对象模型 BOM


    浏览器对象模型 BOM(Browser Object Model)

    由于现代浏览器已经(几乎)实现了 JavaScript 交互性方面的相同方法和属性,因此常被认为是 BOM 的方法和属性

    Window 对象

    Window 对象表示浏览器中打开的窗口。

    如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象。

    所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。

    全局变量是 window 对象的属性。

    全局函数是 window 对象的方法。

    甚至 HTML DOM 的 document 也是 window 对象的属性之一。

    Window 尺寸

    浏览器的视口,不包括工具栏和滚动条。

    对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari:

    window.innerHeight - 浏览器窗口的内部高度 
    window.innerWidth - 浏览器窗口的内部宽度 
    

    对于 Internet Explorer 8、7、6、5:

    document.documentElement.clientHeight 
    document.documentElement.clientWidth 
    

    或者

    document.body.clientHeight 
    document.body.clientWidth 
    

    实例

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

    History 对象

    History 对象包含用户(在浏览器窗口中)访问过的 URL。

    History 对象是 window 对象的一部分,可通过 window.history 属性对其进行访问。

    History 对象属性:

    length 返回浏览器历史列表中的 URL 数量。 
    

    History 对象方法:

    back() 加载 history 列表中的前一个 URL。
    forward() 加载 history 列表中的下一个 URL。
    go() 加载 history 列表中的某个具体页面。 
    

    例子:

    history.back()//执行的操作与单击后退按钮执行的操作一样
    history.go(-2)//执行的操作与单击两次后退按钮执行的操作一样
    

    Location 对象

    Location 对象包含有关当前 URL 的信息。

    Location 对象属性:

    href 设置或返回完整的 URL。 
    

    Location 对象方法:

    assign() 加载新的文档。 
    reload() 重新加载当前文档。 
    replace() 用新的文档替换当前文档。 
    

    Window 对象方法

    alert() 显示带有一段消息和一个确认按钮的警告框。

    blur() 把键盘焦点从顶层窗口移开。

    close() 关闭浏览器窗口。

    focus() 把键盘焦点给予一个窗口。

    moveBy() 可相对窗口的当前坐标把它移动指定的像素。

    moveTo() 把窗口的左上角移动到一个指定的坐标。

    示例:

    window.moveTo(50,50);
    

    open() 打开一个新的浏览器窗口或查找一个已命名的窗口。

    示例:

    var a=window.open('','','width=200,height=100');
    

    prompt() 显示可提示用户输入的对话框。

    resizeBy() 按照指定的像素调整窗口的大小。

    resizeTo() 把窗口的大小调整到指定的宽度和高度。

    scrollBy() 按照指定的像素值来滚动内容。

    示例:

    function fn2(){
    scrollBy(0,200);//可以用它来滚动到指定内容
      }
    

    scrollTo() 把内容滚动到指定的坐标。

    示例:

    function fn1(){
    scrollTo(0,0);//可以用它来回到顶部
      }
    

    setInterval() 按照指定的周期(以毫秒计)来调用函数或计算表达式。

    示例

     function show()
    {
    alert('a');
    }
    setInterval(show, 1000);
    

    setTimeout() 在指定的毫秒数后调用函数或计算表达式。

    示例

    timer=setTimeout("fn3()",100);
    

    clearInterval() 取消由 setInterval() 设置的 timeout。

    clearTimeout() 取消由 setTimeout() 方法设置的 timeout。

    示例

    clearTimeout(timer);
  • 相关阅读:
    Oracle rownum用法、分页
    Oracle 序列(查询序列的值,修改序列的值)
    Photoshop 更换证件照底色
    Oracle 新建用户、赋予权限
    Oracle-SQL 建表
    SQL decode 函数的用法
    英语词汇800常用20类
    c语言常用排序
    js时间戳总结
    Javascript之编译器
  • 原文地址:https://www.cnblogs.com/rwalker/p/5495143.html
Copyright © 2020-2023  润新知