JS中BOM相关知识点总结(必看篇)
window对象
ECMAScript是JavaScript的核心，但是如果要在web中使用javascript，那么BOM(浏览器对象模型)才是真正的核心。BOM提供了很多对象，用于访问浏览器的功能 ，这些功能 与任何网页内容 无关。
window对象：BOM的核心对象是window，它表示浏览器的一个 实例。在浏览器中，window对象有双重角色，它既是通过javascript访问浏览器窗口的一个 接口，又是ECMAScript规定的Global对象。
因此，所有全局作用域中声明的变量、函数 都会变成window对象的属性 和方法 。
rush:js;">
rush:js;">
窗口关系和框架
如果页面 中包含框架，则每个框架都拥有自己的window对象，并且保存在frames集合中。在frames集合中，可以通过数值索引(从0开始，从左到右，从上到下)或者框架名称 来访问相应的window对象。每个window对象都有一个 name属性 ，其中包含着框架的名称 。
可以通过window.frames[0]或者window.frames[“topFrame”]来引用上方的框架。不过，最好使用top，而不是window来引用这些框架。因为，top对象始终指向最高(最外)层的框架，也就是浏览器窗口。使用它可以确保在一个 框架中正确地访问另一个 框架。因为对于一个 在框架中编写的任何代码 来说，其中的window对象指向的都是那个框架的特定实例，而不是最高层的框架。
与top相对的另一个 window对象是parent。parent对象始终指向当前框架的直接上层框架。
与框架有关的最后一个 对象是self，它始终指向window。self和window对象可以互换使用。
在使用框架的情况下，浏览器中会存在多个Global对象。在每个框架中定义的全局变量 会自动 成为框架中window对象的属性 。由于每个window对象都包含原生类型的构造函数 ，因此每个框架都有一套自己的构造函数 ，这些构造函数 一一对应，但并不相等。
location对象
location对象是一个 很特别的对象，因为它既是window对象的属性 ，也是document对象的属性 。window.location和document.location引用的是同一个 对象。
location对象的属性 ：
<div class="jb51code">rush :js;">
<
Meta charset="utf-8">
<
Meta http-equiv="X-UA-Compatible" content="IE=edge">
<a href="https://www.jb51.cc/tag/chaxun/" target="_blank" class="keywords">查询</a>字符串参数
使用location对象可以通过很多方式来改变浏览器的位置。
其中，最常用的方式是：使用assign()方法 并为其传递一个 URL
location.assign(“//www.jb51.cc“)
这样就可以立即打开新的URL并在浏览器的历史记录中生成 一条记录。
同样的，将location.href和window.location设置为一个 URL值,也会以该值调用 assign()方法 。
location.href=”//www.jb51.cc”;
window.location=”//www.jb51.cc”;
这两种方式的效果 和显示 调用 assign()方法 效果 完全一样
此外，通过修改 location对象的其他属性 也可以改变当前加载的页面 。
每次修改 location的属性 (hash除外)，页面 都会以新的URL重新加载。修改 hash的值会在浏览器的历史记录中生成 一条新的记录
在url：http://a.com#helloword中的'#helloworld'就是location.hash，改变hash并不会导致页面 刷新，所以可以利用hash值来进行数据传递，当然数据容量是有限的。
当通过上述任何一种方法 修改 URL之后，浏览器的历史记录中就会生成 一条新纪录，因此通过点击”后退”按钮都会导航到前一个 页面 。
我们可以使用replace()方法 来禁用这种行为。该方法 只接受一个 参数，即要导航到的URL;结果虽然会导致浏览器位置改变，但不会在历史记录中生成 新纪录。在调用 replace()方法 后，用户 不能回到前一个 页面 。
这个页面 加载到浏览器中后，浏览器就会在1秒钟后重新定向到www.jb51.cc。然后，'后退'按钮将处于禁用状态，如果重新输入完整的URL，则无法返回示例页面 。
rush:js;">
Demo2
rush:js;">
Demo3
rush:js;">
在使用超时调用 时，没有必要跟踪超时调用 ID，因为每次执行代码 之后，如果不再设置另一次超时调用 ，调用 就会自动 停止。一般认为，使用超时调用 来模拟间歇调用 是一种最佳模式。间歇调用 一般较少使用，因为后一个 间歇调用 可能会在前一个 间歇调用 结束之前启动。
系统对话框
alert()、confirm()和prompt()
rush:js;">
<script type="text/javascript">用户 点击了OK还是Cancel，可以检查confirm()方法 返回的布尔值：true表示单击了OK，false表示单击了Cancel或单击了右上角的X按钮。
<script type="text/javascript">方法 用来生成 一个 "提示 "框，用于提示 用户 输入一些文本。提示 框除了显示 OK和Cancel按钮之外 ，还会显示 一个 文本输入域，用来输入文本内容 。该方法 接收两个参数：要显示 给用户 的文本提示 和文本输入域的默 认值(可以是一个 空字符串)
history对象
history对象保存着用户 上网的历史记录，从窗口被打开的那一刻算起。因为history是window对象的属性 ，因此每个浏览器窗口、每个标签 页以及每个框架，都有自己的history对象与特定的window对象关联。处于安全方面的考虑，开发人员是无法知道用户 浏览过的URL，不过，借助用户 访问过的页面 列表，同样可以在不知道实际URL的情况下实现后退和前进。
使用Go()方法 可以在用户 的历史记录中任意跳转 ，可以向后也可以向前。该方法 接收一个 参数：表示向前或者向后跳转 的页面 数的整数值。负数表示向后跳转 (类似单击浏览器的后退按钮)，正数表示向前跳转 (类似浏览器的前进按钮)。
rush:js;">
//后退一页
history.go(-1);
//前进一页
history.go(1);
也可以给go()方法 传递一个 字符串参数，此时浏览器会跳转 到历史记录中包含该字符串的第一个 位置–可能后退也可能前进，具体要看哪个位置最近。如果历史记录中不包含该字符串，那么这个方法 什么也不做
rush:js;">
//
跳转 到最近的jb51.cc
history.go("jb51.cc");
另外，还可以使用back()和forward()来代替go()方法
rush:js;">
//后退一页
history.back();
//前进一页
history.forward();
除此之外，history对象还有一个 length属性 ，保存着历史记录的数量 。这个数量 包括 所有的历史记录，即所有的向后和向前的记录。如果history.length==0，则表示这是用户 打开窗口后的第一个 页面
history对象不常用，但是在创建自定义 的后退和前进按钮，以及检测当前页面 是不是用户 历史记录的第一个 页面 时，还是必须使用它。
Demo1
history.html
rush:js;">
<
Meta charset="utf-8">
<
Meta http-equiv="X-UA-Compatible" content="IE=edge">
history
ceshi.html
rush:js;">
<
Meta charset="utf-8">
<
Meta http-equiv="X-UA-Compatible" content="IE=edge">
跳转
这里使用history模仿了一个 输入用户名 之后。跳转 到之前页面 的例子。
Demo2
history2.html
rush:js;">
<
Meta charset="utf-8">
<
Meta http-equiv="X-UA-Compatible" content="IE=edge">
history
跳转
demo.html
rush:js;">
<
Meta charset="utf-8">
<
Meta http-equiv="X-UA-Compatible" content="IE=edge">
这个小例子模拟了history.back()和history.forward()的基本功能
以上就是小编为大家带来的JS中BOM相关知识点总结(必看篇)全部内容 了，希望大家多多支持 编程之家~
