1.BOM(Bowser Object Model浏览器对象模型)

  浏览器创建的对象通常称作文档(Document)对象,它是浏览器使用的众多对象的一部分,浏览器操作的对象结合起来称作浏览器对象模型(Bowser Object Mode),简称BOM。

2.window 对象是顶层对象,它包含了有关文档的窗口信息

2.1 document对象

  • document对象集合

    • anchors[]      //锚地对象数组
    • images[]       //图片对象数组
    • links[]           //连接对象数组
    • form[]           // 表单对象数组
  • document对象属性
    • cookie           //设置或返回当前文档有关的所有cookie
    • domain         //返回当前文档的域名,用于安全目的,字符串类型
    • referrer         //返回载入当前文档的URL
    • title              // 返回当前文档的标题
    • URL             //返回当前文档的URL
    • bgColor        //设置文档的背景颜色
    • fgColor         //设置文档的前景颜色
    • linkColor       //设置未访问连接颜色
    • vlinkColor     //设置已访问连接颜色
  • document对象方法
    • open()          //打开一个新的文档,并擦除旧文档内容
    • close()          //关闭open()打开的文档输出流
    • write()          //向当前文档插入字符串或在open()打开文档末尾添加字符串
    • writeln()        //与write()相同,只是在输出字符串末尾添加回车换行字符串

2.2 screen对象(显示器对象)

  • screen对象属性

    • availHeight   // 屏幕可用高度,单位:px
    • availWidth   //屏幕可用宽度
    • height         //屏幕高度
    • width          // 屏幕宽度
    • colorDepth  //颜色深度,使用像素位数表示

2.3 location对象(位置对象)

  • location对象属性

    • hash                //设置或返回从#开始的URL
    • host                //设置或返回主机名和当前URL端口号
    • hostname        //设置或返回当前URL的主机名
    • href                //设置或返回完整的URL
    • pathname        //设置或返回当前URL的路径部分
    • Port                //设置或返回当前URL的端口部分
    • protocol          //设置或返回当前URL的协议
    • search            //设置或返回从?开始的URL
  • location对象的方法
    • reload(force)   //重新加载当前页面,参数force是可选参数,其值为true时,强制完成加载
    • replace(url)     //使用指定URL替换当前页面,但不在浏览器历史中产生新的登记项,这是该方法与为href属性赋值的不同之处
    • assign(URL)    // 加载新的文档

2.4 history对象(历史对象)

  • history对象方法

    • back()            // 返回到用户刚访问过的页面
    • forward()       // 返回下一个页面
    • go(n)            //  跳转到相对于当前页面的第n个URL表示的页面,正值表示前进,负值表示后退。go(-1)等价于back()

2.5 窗口控制

  • moveBy(dx,dy)                   //将窗口从当前位置移动指定的距离
  • moveTo(x,y)                      //将当前窗口移动到指定位置
  • resizeBy(dw,dh)                 // 将窗口缩放指定的量
  • resizeTo(width,height)        //将窗口大小修改为指定的宽度和高度
  • scrollBy(dx,dy)                   //将窗口内容滚动指定的量
  • scrollTo(x,y)                      //将窗口内容滚动到指定位置

2.6 焦点控制

  • focus   //得到焦点
  • blur     //移除焦点

2.7 打开和关闭窗口

  • 打开窗口

    • 语法:open("URL","窗口名称","窗口风格")
    • 功能:打开一个行的窗口,并在窗口中载入指定URL地址的页面
    • 窗口风格:height(窗口高度) 、width(窗口宽度)、left(窗口左坐标)、top(窗口上坐标)、location(yes |no)是否显示地址栏、menubar(yes |  no) 是否显示菜单栏、resizable(yes |  no) 是否可以改变窗口大小、scrollbars(yes  |no)  是否允许出现滚动条、status(yes  |no)  是否允许显示状态栏、toolbar(yes |no)是   否显示工具栏
  • 关闭窗口
    • close()
    • 功能:自动关闭窗口

2.8 定时器

  • setTimeout(执行代码,毫秒数)               //到了指定的毫秒数,自动执行功能代码
  • clearTimeout(定时器)                           //取消由setTimeout()设置的定时器
  • setInterval(重复执行代码,毫秒数)          //按指定周期重复执行功能代码
  • clearInterval(时间间隔器)                      // 取消由setInterval()设置的时间间隔器

2.9 对话框 

  • alert("提示字符串")                         //弹出一个警告框,在警告框中显示提示字符
  • confirm("提示字符串")                     // 弹出一个确认框,在确认框中显示提示字符,当用户点击”确认“按钮时返回true,点击”取消“时返回false
  • prompt("提示字符串","缺省文本")     //弹出一个输入框,在输入框中显示提示字符串,在输入文本框中显示缺省文本,并等待用户输入,当用户点击"确定"返回用                                                        户输入字符串,点击"取消",返回null

2.10 属性

  • 状态栏

    • defaultStatus               //改变浏览器状态栏默认显示
    • status                         //临时改变浏览器状态栏显示
  • 窗口位置
    • IE浏览器

      • scrollLeft  |  scrollTop                                                                                               //窗口左上角X坐标,Y坐标
      • document.documentELement.scrollLeft/scrollTop  或document.body.scrollLeft/scrollTop   //当前文档向右、向下滚动的像素
    • Firefox浏览器
      • innerHeight  |    innerWidth          //返回窗口的文档显示区的高度和宽度(不包括菜单栏、工具条、滚动条)  单位:px
      • outHeight    |     outWidth           //返回窗口总的高度和宽度(包括菜单栏、工具条、滚动条)  单位:px
    • !IE浏览器
      • screenX   |    screenY           //窗口左上角X坐标、Y坐标
      • pageXoffset  |pageYoffset    //当前文档向右、向下滚动的像素
  • 其他属性

    • name       //设置或返回窗口名称
    • self          // 返回对当前窗口的引用
    • closed      // 当窗口关闭时返回true
    • opener

2.11 navigator对象(导航器对象)

  • navigator对象属性

    • appCodeName       //返回浏览器的代码名
    • appNode               //返回浏览器名称
    • appVersion           //返回浏览器平台和版本信息
    • cookieEnabled       //返回浏览器中是否启用cookie的布尔值,打开时,其值为true,否则为false
    • platform               //返回浏览器运行的操作系统平台
    • userAgent            //返回浏览器在HTTP请求中使用的用户代理首部的值
  • navigator对象方法
    • javaEnabled()        //如果浏览器支持java,并打开了对java的支持则返回true,否则返回false

javascript BOM基本知识的更多相关文章

  1. JavaScript BOM 遗漏知识再整理;弹窗和记时事件;

    1.JavaScript 弹窗 警告框 警告框经常用于确保用户可以得到某些信息. 当警告框出现后,用户需要点击确定按钮才能继续进行操作. window.alert() 方法可以不带上window对象, ...

  2. JavaScript BOM对象介绍

    bom:即broswer object model(浏览器对象模型),由五个对象组成:        Window:对象表示浏览器中打开的窗口 最顶层对象.       Navigator :浏览器对 ...

  3. javascript bom 编程

     javascript bom  编程 BOM: 浏览器对象模型 DOM Window  :窗口Window Document 属性:     status :状态栏     self:自己    ...

  4. 快速掌握JavaScript面试基础知识(三)

    译者按: 总结了大量JavaScript基本知识点,很有用! 原文: The Definitive JavaScript Handbook for your next developer interv ...

  5. 快速掌握JavaScript面试基础知识(二)

    译者按: 总结了大量JavaScript基本知识点,很有用! 原文: The Definitive JavaScript Handbook for your next developer interv ...

  6. 前端基础:JavaScript BOM对象

    JavaScript BOM对象 JavaScript Window - 浏览器对象模型 浏览器对象模型(BOM)使JavaScript有能力与浏览器"对话". 浏览器对象模型(B ...

  7. JavaScript 面向对象开发知识基础总结

    JavaScript 面向对象开发知识基础总结 最近看了两本书,书中有些内容对自己还是很新的,有些内容是之前自己理解不够深的,所以拿出来总结一下,这两本书的名字如下: JavaScript 面向对象精 ...

  8. JavaScript的高级知识---词法分析

    JavaScript的高级知识---词法分析 词法分析 词法分析方法: js运行前有一个类似编译的过程即词法分析,词法分析主要有三个步骤: 分析参数 再分析变量的声明 分析函数说明 函数在运行的瞬间, ...

  9. JavaScript BOM DOM 对象

    title: JavaScript BOM DOM 对象 tags: JavaScript --- browser object model document onject model BOM对象 w ...

随机推荐

  1. 在移动端H5开发中(关于安卓端position:fixed和position:absolute;和虚拟键盘冲突的问题,以及解决方案)

    一.在开发移动端webapp时,我们经常会遇到这样的问题,当我们需要在页面底部固定一个logo或者说明时,往往会采用position:fixed进行固定定位或者absolute定位到最底部 这是一个很 ...

  2. Final Battle #1 K题 Fire game

    Description Fat brother and Maze are playing a kind of special (hentai) game on an N*M board (N rows ...

  3. //……关于TCP三次握手与四次挥手

    TCP的概述 TCP把连接作为最基本的对象,每一条TCP连接都有两个端点,这种断点我们叫作套接字(socket),它的定义为端口号拼接到IP地址即构成了套接字,例如,若IP地址为192.3.4.16 ...

  4. [转] angular2-highcharts用法详解

    1. 使用npm安装angular2-highcharts npm install angular2-highcharts --save 2.主模块中引入 app.module.ts import { ...

  5. 关于SELECT 逻辑的执行顺序问题

    不会有大多数人都和我一样的认为,是先进行的Where 剔除结果集,再进行Join的吧 SQL server 2014 逻辑执行标准: https://msdn.microsoft.com/en-us/ ...

  6. Android OkHttp(1)

     Android OkHttp(1) OkHttp是一个流行的第三方开源网络请求框架,在目前的一些APP开发中比较流行.Android平台开源的网络请求框架不少,比如常见的Volley, Asyn ...

  7. 582. Kill Process

    Problem statement: Given n processes, each process has a unique PID (process id) and its PPID (paren ...

  8. POJ1094 字母排序(拓扑排序)

    该题题意明确,就是给定一组字母的大小关系判断他们是否能组成唯一的拓扑序列.是典型的拓扑排序,但输出格式上确有三种形式: 1.该字母序列有序,并依次输出: 2.该序列不能判断是否有序: 3.该序列字母次 ...

  9. [cf360 div1.C]The Values You Can Make[Dp]

    题意:有n个硬币,面值不同,求能组成K的方案中,每个方案的硬币可以凑成那些答案. 例如, K=5 面值={1,1,1,2,3} K={1,1,1,2} K={1,1,3} K={2,3} 那么答案是 ...

  10. 用JQ实现基础的添加,插入,删除功能。

    在eclipse里面运行代码即可,如果您是其他应用,请选择对您有帮助的代码即可,如果有写错或不懂的地方请联系QQ:1633420056,谢谢,祝学习进步 <!DOCTYPE html>&l ...