欢迎光临
我的个人博客网站

Java入门到架构师教程之JavaScript:history对象和location对象、JavaScript设计模式系统讲解与应用


一、history对象

history 对象是历史对象。包含用户(在浏览器窗口中)访问过的 URL。history 对象是 window 对象的一部分,可通过 window.history 属性对其进行访问。

history对象的属性:length,返回浏览器历史列表中的 URL 数量。

history对象的方法:

back():加载 history 列表中的前一个 URL。

forward():加载历史列表中的下一个 URL。当页面第一次访问时,还没有下一个url。

go(number|URL): URL 参数使用的是要访问的 URL。而 number 参数使用的是要访问的 URL 在 History 的 URL 列表中的相对位置。go(-1),到上一个页面。

1、013-history.html

<body>     <a href="013-history-a.html">013-history-a.html</a>     <h1>我是第一个页面</h1>     <input type="button"  value="前进" onclick="window.history.forward();" />     <script>         console.log(window.history);     </script> </body>

 

2、013-history-a.html

<body>     <a href="013-history-b.html">013-history-b.html</a>     <h1>我是A页面</h1>     <input type="button" value="后退"  onclick="window.history.back();"/> </body>

 

3、013-history-b.html

<body>       <h1>我是B页面</h1>       <input type="button" value="第一个页面" onclick="window.history.go(-2);"/>       <input type="button" value="后退"  onclick="window.history.back();"/> </body>

 

二、location对象

location 对象是window对象之一,提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能。也可通过 window.location 属性来访问。

location 对象的属性 href:设置或返回完整的 URL

location 对象的方法

reload():重新加载当前文档。

replace():用新的文档替换当前文档。

<script type="text/javascript">     function openBaidu(){         // 没有历史记录,用新的文档替换当前文档         // window.location.replace("http://www.baidu.com");         // console.log(window.location.href); // 获取完整的url         window.location.href = "http://www.baidu.com";     } </script> <body>     <input type="text"  value="" />     <input type="button" value="刷新" onclick="window.location.reload();" />     <input type="button"  value="百度" onclick="openBaidu();" /> </body>

 

三、JavaScript设计模式系统讲解与应用

关于JavaScript设计模式讲解应用这一块,建议学习下面这套教程即可,获取方式图片中有。

Java入门到架构师教程之JavaScript:history对象和location对象、JavaScript设计模式系统讲解与应用

课程内容丰富完整,学习JavaScript非常不错。欢迎来学习JavaScript设计模式讲解与应用。

四、本节作业

实现时间计时功能
JS的跳转方式
本文是全套Java入门到架构师全套教程中的JavaScript中的BOM对象课程文档,如需完整体系大数据教程资源请留言评论或私聊。

赞(0) 打赏
未经允许不得转载:张拓的天空 » Java入门到架构师教程之JavaScript:history对象和location对象、JavaScript设计模式系统讲解与应用
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

专业的IT技术经验分享 更专业 更方便

联系我们本站主机

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏