JavaScript编程中window的location与history对象详解


Posted in Javascript onOctober 26, 2015

Window Location

  • window.location 对象用于获得当前页面的地址 (URL),并把浏览器重定向到新的页面。
  • window.location 对象在编写时可不使用 window 这个前缀。 一些例子:
  • 一些实例:
  • location.hostname 返回 web 主机的域名
  • location.pathname 返回当前页面的路径和文件名
  • location.port 返回 web 主机的端口 (80 或 443)
  • location.protocol 返回所使用的 web 协议(http:// 或 https://)

Window Location Href

location.href 属性返回当前页面的 URL。
实例
返回(当前页面的)整个 URL:

<script>

document.write(location.href);

</script>

Window Location Pathname
location.pathname 属性返回 URL 的路径名。
实例
返回当前 URL 的路径名:

<script>

document.write(location.pathname);

</script>

以上代码输出为:

/js/js-window-location.html


Window Location Assign
location.assign() 方法加载新的文档。
实例
加载一个新的文档:

<html>
<head>
<script>
function newDoc()
 {
 window.location.assign("http://www.w3cschool.cc")
 }
</script>
</head>
<body>

<input type="button" value="Load new document" onclick="newDoc()">

</body>
</html>

Window History
window.history对象在编写时可不使用 window 这个前缀。
为了保护用户隐私,对 JavaScript 访问该对象的方法做出了限制。
一些方法:

  • history.back() - 与在浏览器点击后退按钮相同
  • history.forward() - 与在浏览器中点击按钮向前相同

Window History Back

history.back() 方法加载历史列表中的前一个 URL。
这与在浏览器中点击后退按钮是相同的:
实例
在页面上创建后退按钮:

<html>
<head>
<script>
function goBack()
 {
 window.history.back()
 }
</script>
</head>
<body>

<input type="button" value="Back" onclick="goBack()">

</body>
</html>

Window History Forward
history forward() 方法加载历史列表中的下一个 URL。
这与在浏览器中点击前进按钮是相同的:
实例
在页面上创建一个向前的按钮:

<html>
<head>
<script>
function goForward()
 {
 window.history.forward()
 }
</script>
</head>
<body>

<input type="button" value="Forward" onclick="goForward()">

</body>
</html>
Javascript 相关文章推荐
firefox firebug中文入门教程 脚本之家新年特别版
Jan 02 Javascript
javascript 节点排序 2
Jan 31 Javascript
JavaScript高级程序设计 DOM学习笔记
Sep 10 Javascript
js获得网页背景色和字体色的方法
Mar 21 Javascript
jquery attr方法获取input的checked属性问题
May 26 Javascript
angularJS提交表单(form)
Feb 09 Javascript
node.js入门教程之querystring模块的使用方法
Feb 27 Javascript
js获取浏览器的各种属性
Apr 27 Javascript
Vue进度条progressbar组件功能
Apr 17 Javascript
微信小程序生成二维码的示例代码
Mar 29 Javascript
JS校验与最终登陆界面功能完整示例
Jan 13 Javascript
VUE实现自身整体组件销毁的示例代码
Jan 13 Javascript
jquery移动端TAB触屏切换实现效果
Dec 22 #Javascript
基于jQuery实现搜索关键字自动匹配功能
Mar 26 #Javascript
以Python代码实例展示kNN算法的实际运用
Oct 26 #Javascript
Windows下用PyCharm和Visual Studio开始Python编程
Oct 26 #Javascript
php利用curl获取远程图片实现方法
Oct 26 #Javascript
jQuery.trim() 函数及trim()用法详解
Oct 26 #Javascript
JavaScript中的数据类型转换方法小结
Oct 26 #Javascript
You might like
php自动给文章加关键词链接的函数代码
2012/11/29 PHP
php过滤html标记属性类用法实例
2014/09/23 PHP
php计算两个日期相差天数的方法
2015/03/14 PHP
PHP随机生成信用卡卡号的方法
2015/03/23 PHP
php实现读取和写入tab分割的文件
2015/06/01 PHP
php慢查询日志和错误日志使用详解
2021/02/27 PHP
javascript实现信息的显示和隐藏如注册页面
2013/12/03 Javascript
深入理解Javascript中this的作用域
2014/08/12 Javascript
javascript实现避免页面按钮重复提交
2015/01/08 Javascript
基于JavaScript实现网页倒计时自动跳转代码
2015/12/28 Javascript
分享两款带遮罩的jQuery弹出框
2015/12/30 Javascript
微信小程序 闭包写法详细介绍
2016/12/14 Javascript
jQuery实现 RadioButton做必选校验功能
2017/06/15 jQuery
基于匀速运动的实例讲解(侧边栏,淡入淡出)
2017/10/17 Javascript
nodejs调取微信收货地址的方法
2017/12/20 NodeJs
JavaScript中的高级函数
2018/01/04 Javascript
一步步教会你微信小程序的登录鉴权
2018/04/09 Javascript
Vue2.5学习笔记之如何在项目中使用和配置Vue
2018/09/26 Javascript
详解关于微信setData回调函数中的坑
2019/02/18 Javascript
Typescript 中的 interface 和 type 到底有什么区别详解
2019/06/18 Javascript
原生js实现随机点名
2020/07/05 Javascript
Python2.7基于淘宝接口获取IP地址所在地理位置的方法【测试可用】
2017/06/07 Python
Python实现二叉搜索树BST的方法示例
2019/07/30 Python
python enumerate内置函数用法总结
2020/01/07 Python
Python 日期时间datetime 加一天,减一天,加减一小时一分钟,加减一年
2020/04/16 Python
python中读入二维csv格式的表格方法详解(以元组/列表形式表示)
2020/04/24 Python
Python基于gevent实现文件字符串查找器
2020/08/11 Python
CSS3+font字体文件实现圆形半透明菜单具体步骤(图解)
2013/06/03 HTML / CSS
Cecil Mode法国在线商店:女性时尚
2021/01/08 全球购物
为什么要有struct关键字
2012/05/08 面试题
司机工作自我鉴定
2014/09/19 职场文书
客房服务员岗位职责
2015/02/09 职场文书
酒店宣传语大全
2015/07/13 职场文书
2016简历自荐信优秀范文
2016/01/29 职场文书
基于Nginx实现限制某IP短时间访问次数
2021/03/31 Servers
关于python3 opencv 图像二值化的问题(cv2.adaptiveThreshold函数)
2022/04/04 Python