zoukankan      html  css  js  c++  java
  • BOM总结

      BOM(浏览器对象模型),提供了独立于页面内容而与浏览器窗口进行交互的对象。使用BOM,开发者可以移动窗口、改变状态栏的文本以及执行其他与页面内容不直接的动作。BOM由一系列相关的对象构成。

    一、window 对象

      window对象是整个BOM的核心,所有对象和集合都以某种方式与window对象关联。

    1.窗口操作

      window对象调整窗口的大小和位置:

        1)window.moveBy(dx,dy)--将浏览器窗口相对当前位置水平或垂直移动(px)到指定的距离(相对定位);

        2)window.moveTo(x,y)--移动浏览器窗口,使它的左上角位于屏幕的(x,y)处,可使用负数(绝对定位);

        3)window.resizeBy(dw,dh)--相对于浏览器窗口当前的大小改变为指定的宽度和高度(px),当为负数时,窗口则缩小(相对调整窗口大小)

        4)window.resizeTo(w,h)--调整窗口为指定的宽度和高度,不能为负数。

    2.打开新窗口

      height:窗口的高度,单位像素;

      width:窗口的宽度,单位像素;

      Left:窗口的左边缘位置;

      top:窗口的上边缘位置;

      fullscreen:是否全屏,默认值no;

      location:是否显示地址栏,默认值yes;

      menubar:是否显示菜单栏,默认值yes;

      resizable:是否允许改变窗口大小,默认值yes;

      scrollbars:是否显示滚动条,默认值yes;

      status:是否显示状态栏,默认值yes;

      titlebar:是否显示标题栏,默认值yes;

      toolbar:是否显示工具条,默认值yes;

    3.系统对话框

      1)window.alert--显示消息提示框

        Window.alert([message])

      2)window.confirm--显示一个确认提示框,点击Ok按钮是返回true,点击Cancel按钮时返回false;

        window.confirm([message])

      3)window.prompt--显示一个文本输入消息框,此方法接受两个参数,即要显示给用户的文本和文本框中的默认文本(可为空);

        window.prompt([message],[default])

    4.状态栏

      浏览器状态的显示信息可以通过window.status属性直接进行修改。

        window.status="[message]"

    5.时间间隔和暂停

      定时操作通常有两种使用目的,一种是周期性的执行脚本,如时钟;另一种则是将某个操作延时一段时间执行。window.setTimeout函数使其延时执行,且后面脚本正常运行。

      1)window.setInterval--用于设置定时器,每隔一段时间执行指定代码;

        window.setInterval(执行代码,等待的毫秒数)

      2)window.clearInterval--用于清除setInterval函数设定的定时器;

        window.clearInterval(阻止执行的代码id)

      3)window.setTimeout--用于设置定时器,在一段时间之后执行指定代码;

        window.setTimeout(执行代码,等待的毫秒数)

      4)window.clearTimeout--用于清除setTimeout函数设定的定时器;

        window.clearTimeout(阻止执行的代码id)

    6.历史

      window.history访问浏览器窗口的历史,可使用length属性查看历史中的页面数,alert(history.length);

      window.history.go(前进为正数/后退为负数)/history.go(前进为正数/后退为负数)

      history.back()--返回一页

      history.forward()--前进一页

    二、document 对象

      document 对象实际上是window 对象的属性,window 对象的任何属性和方法都可以直接访问。

      document 对象的集合:

      anchors:页面中所有锚的集合(由<a name=”anchorname”></a>表示);

      applets:页面中所有applet的集合;

      embeds:页面中所有嵌入式对象的集合(由<embed/>标签表示);

      forms:页面中所有表单的集合;

      images:页面中所有图像的集合;

      links:页面中所有链接的集合(<a href=”somewhere.html”></a>表示);

    1)document.write/writeIn()--在当前文档中输入文字(writeIn比write末尾多一个换行);

      document.write/writeIn(text)

    2 )document.open和document.close是一组方法,通常与document.write/writeIn方法配合使用。

      document.open--打开文档准备写入内容;

      document.close--用于关闭文档,同时将写出内容输出到页面;

    三、location 对象

      location.href是最常用的属性,用于获取或设置窗口的URL,改变该属性的值,就可导航到新的页面:

      location.href=”http://www.baidu.com/“;

      location.assign()方法实现的是同样的操作:

      location.assign(”http://www.baidu.com/“);

      location.reload()方法有两种模式,即从浏览器缓存中重载(false),或从服务器端重载(true);

    四、navigator 对象

      navigator 对象包含了关于Web浏览器的信息,浏览器的类型、版本信息都可以从对象中获取。

    五、screen 对象

      screen 对象用于获取某些关于用户屏幕的信息;

      screen 对象的属性:

      availHeight:窗口可以使用的屏幕高度(px),其中包括操作系统元素(如window工具栏)需要的空间;

      availWidth:窗口可以使用的屏幕宽度(px);

      colorDepth:用户表示颜色的位数;

      height:屏幕的高度(px);

      width:屏幕的宽度(px);

  • 相关阅读:
    markdown基础
    img alt与title的区别
    关于echarts 报错 初始化对象未定义
    easyui datagrid 右边框被隐藏
    ie 浏览器文本输入框和密码输入框的默认样式
    谷歌内核浏览器 iframe内容的 tab切换 滚动条消失
    导入sass文件
    嵌套规则
    关于ruby -gem无法切换淘宝源
    sass 变量
  • 原文地址:https://www.cnblogs.com/LeeX/p/4082506.html
Copyright © 2011-2022 走看看