BOM
最后更新于:2022-04-01 23:53:48
## BOM
Window对象是客户端JavaScript程序的全局对象。
**11.1 计时器**
`setTimeout()`和`setInterval()`可以用来注册在指定的时间之后单次或重复调用的函数。两者都是客户端JavaScript中的全局函数,也就是Window对象的方法。
**(1)setTimeout()**
`setTimeout()`方法用来实现一个函数在指定的毫秒数之后运行,返回一个值,这个值可以传递给clearTimeout()用于取消这个函数的执行。
```
var times = setTimeout(function(){},1000); //1000毫秒后执行
clearTimeout(times); //取消执行
```
**(2)setInterval()**
setInterval()方法和setTimeout()一样,只不过这个函数会在指定毫秒数的间隔里重复调用,也返回一个值,这个值传递给clearInterval(),用于取消后续函数的调用。
```
var times = setInterval(function(){},1000); //每隔1000毫秒调用一次function
clearInterval(times); //取消后续函数执行
```
注意:如果以0毫秒的超时时间来调用setTimeout(),那么指定的函数不会立刻执行。相反,会把它放到队列中,等到前面处于等待状态的事件处理程序全部执行完成后,再“立即”调用它。
**11.2 浏览器定位和导航**
Window对象的`location`属性引用的是`Location`对象,它表示该窗口中当前显示的文档的URL,并定义了方法来使窗口载入新的文档。
Document对象的location属性也引用到Location对象:
```
window.location === document.location //总是返回true
```
Document对象也有一个URL属性,是文档首次载入后保存该文档的URL的静态字符串。如果定位到文档中的片断标识符(如#top),Location对象会做相应的更新,而document.URL属性却不会改变。
**11.2.1 解析URL**
Location对象href属性是一个字符串,href属性包含ULR的完整文本。Location对象的toString()方法返回href属性的值,因此在会隐式调用toString()的情况下,可以用location代替location.href。
```
// 当前网址为 http://user:passwd@www.example.com:4097/path/a.html?x=111#part1location.href // "http://user:passwd@www.example.com:4097/path/a.html?x=111#part1"
location.protocol // "http:"
location.host // "www.example.com:4097"
location.hostname // "www.example.com"
location.port // "4097"
location.pathname // "/path/a.html"
location.search // "?x=111"
location.hash // "#part1"
location.user // "user"
location.password // "passed"
```
protocol、host、hostname、port、pathname和search属性是“URL分解”属性,是可写的,对它们重新赋值的话,会改变URL的位置,并且浏览器会载入一个新的文档。
`Location`对象的方法:
- `location.assign()`:使窗口载入并显示指定的URL中的文档。
- `location.replace()`:和assign()方法类似,但它在载入新文档之前会从浏览历史中把当前文档删除。这样“后退”按钮就不会把浏览器带回到原始文档。
- `location.reload()`:重新载入当前文档,可传入一个布尔值为参数,默认false。如果为true,则优先从服务器重新加载;否则优先从本地缓存中重新加载。
当然,我们还有更直接跳转到新页面的方法:
```
location = 'http://baidu.com';
//或者
location.href = 'http://baidu.com';
```
纯粹的片断标识符是相对URL的一种类型,它不会让浏览器载入新文档,而是使浏览器滚动到文档的某个位置。
注意:#top标识符是个特殊值:如果文档中没有元素的ID是“top”,它会让浏览器滚动到文档开始处。
```
location = '#top'; //跳转到文档的顶部
```
**11.3 浏览历史**
Window对象的history属性引用的是该窗口的History对象。History对象是用来把窗口浏览历史用文档和文档状态列表的形式表示。
History对象的length属性表示浏览历史表中的元素数量。比如你在当前窗口访问了三个不同的网址,那么history.length就等于3。
History对象还提供了一系列的方法,让我们在历史记录中自由前进和后退。
- back():移动到上一个访问页面,等同于浏览器的后退键。
- forward():移动到下一个访问页面,等同于浏览器的前进键。
- go():接受一个整数作为参数,移动到该整数指定的页面,比如go(1)相当于forward(),go(-1)相当于back()。
如果移动的位置超出了访问历史的边界,以上三个方法并不报错,而是默默的失败。
history.go(0)相当于刷新当前页面。
```
history.go(0)
```
注意:如果窗口包含多个子窗口(比如
';