我们知道，JavaScript共由三部分组成：EMCAScript（基本语法）、BOM（浏览器对象模型）、DOM。

在浏览器对象模型中，把浏览器的各个部分都用了一个对象进行描述，如果我们要操作浏览器的一些属性，就可以通过浏览器对象模型的对象进行操作

下面我们来介绍一下浏览器对象模型的基本的对象：

window  代表了一个新开的窗口

location 代表了地址栏对象。

screen  代表了整个屏幕的对象

window对象常用的方法

//open()   打开一个新的窗口（参数一：打开的地址，参数二：是否为新的浏览器窗口，参数三：新窗口属性，参数四：用来替代的地址）

window.open("2.html","_blank","height=400px,width=600px,toobar=no,location=yes,top=200px","用来替代的地址");

//resizeTo() 将窗口的大小更改为指定的宽度和高度值

window.resizeTo(300,200);

//moveBy()  相对于原来的窗口移动指定的x、y值

window.moveBy(100,0);//谷歌浏览器貌似不支持了

//moveTo() 将窗口左上角的屏幕位置移动到指定的 x 和 y 位置。

window.moveTo(100,0);//谷歌浏览器貌似不支持了

//setInterval() 每经过指定毫秒值后就会执行指定的代码

//clearInterval() 根据一个任务的ID取消的定时任务

//setTimeout() 经过指定毫秒值后执行指定 的代码一次

事件

定义：当发生一个事件之后，会触发特定的方法

那么如何注册一个事件呢？

  • 事件的注册方式
 //方式一： 直接在html元素上注册

<body onload="ready()">

    function ready(){

      alert("body的元素被加载完毕了..");

    }

//方式二：先在js代码找到对应的对象再注册,一般推荐使用这种方式，可以增强可维护性

var bodyNode = document.getElementById("body");

    bodyNode.onload = function(){

        alert("body的元素被加载完毕");

}
  • 常用的事件
鼠标点击相关：

onclick 在用户用鼠标左键单击对象时触发。

ondblclick 当用户双击对象时触发。

onmousedown 当用户用任何鼠标按钮单击对象时触发。

onmouseup 当用户在鼠标位于对象之上时释放鼠标按钮时触发。 

鼠标移动相关：

onmouseout  当用户将鼠标指针移出对象边界时触发。

onmousemove 当用户将鼠标划过对象时触发。 

焦点相关的：

onblur 在对象失去输入焦点时触发。

onfocus 当对象获得焦点时触发。

其他：

onchange 当对象或选中区的内容改变时触发。

onload 在浏览器完成对象的装载后立即触发。

onsubmit 当表单将要被提交时触发。

location对象

此对象是浏览器地址栏对象，所以我们能够改变地址栏信息，或者进行其他的一些改变。

想要获取到url只需要使用location.href即可。

有两个比较常用的东西：

//href : 设置以及获取地址栏的对象

location.href = "http://www.baidu.com";//每天总在莫名其妙的给百度打广告。。

//reload() 刷新当前的页面

location.reload();

screen对象

  • 常用的方法
availHeight 获取系统屏幕的工作区域高度，排除 Microsoft Windows 任务栏。

availWidth  获取系统屏幕的工作区域宽度，排除 Windows 任务栏。

height      获取屏幕的垂直分辨率。

width       获取屏幕的水平分辨率。
  • 使用方法
document.write("获取系统屏幕的工作区域高度："+screen.availHeight+"<br/>");

document.write("获取系统屏幕的工作区域宽度："+screen.availWidth+"<br/>");

document.write("获取屏幕的垂直分辨率："+screen.height+"<br/>");

document.write("获取屏幕的水平分辨率："+screen.width+"<br/>");

这一讲我们学习的是BOM（浏览器对象模型）

从下一节开始，我们将开始学习JavaScript的最后一个部分，DOM编程。

JavaScript学习总结（六）的更多相关文章

  1. JavaScript学习总结(六)——前端模块化开发

    早期的javascript版本没有块级作用域.没有类.没有包.也没有模块,这样会带来一些问题,如复用.依赖.冲突.代码组织混乱等,随着前端的膨胀,模块化显得非常迫切. 前端模块化规范如下: 一.前端模 ...

  2. JavaScript学习总结(六)——JavaScript判断数据类型总结

    最近做项目中遇到了一些关于javascript数据类型的判断处理,上网找了一下资料,并且亲自验证了各种数据类型的判断,在此做一个总结吧! 一.JS中的数据类型 1.数值型(Number):包括整数.浮 ...

  3. arcgis api for javascript 学习（六） 地图打印

    1.本文应用arcgis api for javascript对发布的动态地图进行打印,打印的为PDF格式,打印出来如图: 2.需要特别注意的是:我们在运行代码前,需要打开PrintingTools, ...

  4. JavaScript学习 - 基础(六) - DOM基础操作

    DOM: DOM定义了访问HTML 和XML 文档的标准:1.核心DOM 针对结构化文档的标准模型2.XMK DOM 针对XML文档的标准模型3.HTML DOM 针对HTML文档的标准模型 DOM节 ...

  5. JavaScript学习（六）

    这里要注意: 1.num为NaN(因为str的开头不是数字) 2.NaN和NaN是不等的 3.NaN也是number.

  6. javascript学习笔记(四) Number 数字类型

    数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数  toExponential() 方法 用科学 ...

  7. JavaScript学习总结——转

    JavaScript学习总结(一)——JavaScript基础 JavaScript学习总结(二)——逻辑Not运算符详解 JavaScript学习总结(三)——逻辑And运算符详解 JavaScri ...

  8. 前端学习 第六弹： javascript中的函数与闭包

    前端学习 第六弹:  javascript中的函数与闭包 当function里嵌套function时,内部的function可以访问外部function里的变量 function foo(x) {   ...

  9. JavaScript学习基础部分

    JavaScript学习基础 一.简介 1.JavaScript 是因特网上最流行的脚本语言,并且可在所有主要的浏览器中运行,比方说 Internet Explorer. Mozilla.Firefo ...

  10. Javascript学习5 - 函数

    原文:Javascript学习5 - 函数 在Javascript中,函数和对象是交织在一起的.有些函数的特性与对象相关联.这一点的内容在第六部分会讨论到. 这一部分主要讨论函数与其它比较熟悉的语言( ...

随机推荐

  1. EditText标签的使用

    前文: 介绍EditText的使用,这个是文本输入控件,用来输入文本内容 使用: EditText继承TextView所以TextView的东西EditText都可以使用 text:显示文本 text ...

  2. HihoCoder第七周：完全背包问题

    1043 : 完全背包 时间限制:20000ms 单点时限:1000ms 内存限制:256MB 描述 且说之前的故事里,小Hi和小Ho费劲心思终于拿到了茫茫多的奖券!而现在,终于到了小Ho领取奖励的时 ...

  3. 又一个无效的列类型错误Error setting null for parameter #7 with JdbcType NULL . Try setting a different JdbcType for this parameter or a different jdbcTypeForNull configuration property. Cause: java.sql.SQLExcept

    在更新数据时候出现的错误 更新代码如下: <update id="modify" parameterType="Standard"> update ...

  4. 指令——free

    free指令 一个完整的指令的标准格式: Linux通用的格式——#指令主体(空格) [选项](空格) [操作对象] 一个指令可以包含多个选项,操作对象也可以是多个. free指令作用:查看内存使用情 ...

  5. 二、JavaScript之点击按钮改变HTML样式 (CSS)

    一.代码如下 二.点击前 三.点击后 <!DOCTYPE html> <html> <meta http-equiv="Content-Type" c ...

  6. HDU_4939 stupid tower defense 2014多校7 多变量型DP

    意思是有个塔防游戏,有三种塔,红塔在怪物经过的时候每秒会产生攻击力大小的伤害,绿塔对怪物经过以及经过之后每秒产生攻击力大小的伤害,还有种蓝塔,对怪物进行减速,即怪物从此之后经过一个单位都会减慢c秒 最 ...

  7. nui UI 具有右键属性的菜单树

    参考示例:树右键菜单                 一:创建ContextMenu     <ul id="treeMenu" class="nui-contex ...

  8. 解决Spring Mvc中接受参数绑定重名的方法

    html页面 <form method='post' action='url'> 用户名 <input type='text' name='name'> 用户id <in ...

  9. Ubuntu18安装LAMP环境详细步骤

    Ubuntu18安装Lamp环境 1.su root  切换root账号(root账户权限高不用总输入sudo) 更新源 阿里源网址:https://opsx.alibaba.com/mirror 更 ...

  10. UVA - 10570 Meeting with Aliens（外星人聚会）（暴力枚举）

    题意:输入1~n的一个排列(3<=n<=500),每次可以交换两个整数.用最少的交换次数把排列变成1~n的一个环状序列. 分析:正序反序皆可.枚举每一个起点,求最少交换次数,取最小值. 求 ...