BOM编程③(location、navigator、history对象)

BOM编程③(location、navigator、history对象)

文章目录

​​location 对象​​

​​什么是location对象​​​​URL​​​​location 对象的属性​​​​location 对象的方法​​

​​navigator 对象​​​​history 对象​​

location 对象

什么是location对象

window 对象给我们提供了一个 location 属性用于获取或设置窗体的 URL，并且可以用于解析 URL 。 因为这个属性返回的是一个对象，所以我们将这个属性也称为 location 对象。

URL

​​统一资源定位符 (Uniform Resource Locator, URL)​​ 是互联网上标准资源的地址。互联网上的每个文件都有一个唯一的 URL，它包含的信息指出文件的位置以及浏览器应该怎么处理它。

URL 的一般语法格式为：

protocol://host[:port]/path/[?query]#fragment 对象的属性

案例1：5秒钟之后自动跳转页面

分析：

① 利用定时器做倒计时效果

② 时间到了，就跳转页面。 使用 location.href

代码实现：

案例2：获取 URL 参数数据 主要练习数据在不同页面中的传递。

案例分析： ① 第一个登录页面，里面有提交表单， action 提交到 index.html页面 ② 第二个页面，可以使用第一个页面的参数，这样实现了一个数据不同页面之间的传递效果 ③ 第二个页面之所以可以使用第一个页面的数据，是利用了URL 里面的 location.search参数 ④ 在第二个页面中，需要把这个参数提取。 ⑤ 第一步去掉？ 利用 substr ⑥ 第二步 利用=号分割 键 和 值 split(‘=‘) ⑦ 第一个数组就是键 第二个数组就是值

代码实现：

注意： ①要提交表单，则一定还有form表单域，还有提交按钮 ②form中的action属性有跳转的作用

location 对象的方法

例如：

强制刷新：从服务器中重新获取数据，而不是从本地缓存中获取。

navigator 对象

navigator 对象包含有关浏览器的信息，它有很多属性，我们最常用的是 userAgent，该属性可以返回由客户机发送服务器的 user-agent 头部的值。

下面前端代码可以判断用户那个终端打开页面，实现跳转:

if((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) { window.location.href = ""; //手机} else { window.location.href = ""; //电脑}

history 对象

window 对象给我们提供了一个 history 对象，与浏览器历史记录进行交互。该对象包含用户（在浏览器窗口中）访问过的 URL

history 对象一般在实际开发中比较少用，但是会在一些 OA 办公系统中见到

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。