详解window.location对象是如何实现页面跳转的？-群英

您现在的位置是：群英 > 开发技术 > web开发

详解window.location对象是如何实现页面跳转的？

Admin发表于 2022-08-31 17:19:201860 次浏览

上一篇：详解JavaScript里面cookie操作对象的应用教程

下一篇：什么是window.screen对象应用？

这篇文章分享给大家的内容是关于详解window.location对象是如何实现页面跳转的？，本文介绍得很详细，内容很有参考价值，希望可以帮到有需要的小伙伴，接下来就让小编带领大家一起了解看看吧。

本篇文章给大家带来了关于javascript的相关知识，其中主要介绍了window.location对象实现页面跳转的相关问题，window.location对象用于获得当前页面的地址，并把浏览器重定向到新的页面。

window.location对象用于获得当前页面的地址（URL），并把浏览器重定向到新的页面。

window location 对象在编写时可不使用Window这个前缀。一些例子：

location.hostname返回web主机的域名
location.pathname返回当前页面的路径和文件名
location.port返回web主机的端口
location.protocol返回所使用的的web协议

window location href

示例

返回当前页面的URL：

<script type="text/javascript">
	    document.write(location.href);
</script>

以上代码输出为：

http://127.0.0.1:8848/7.11/new_file.html

window location pathname

location.pathname属性返回URL的路径名。

示例

返回当前URL的路径名：

<script type="text/javascript">
		document.write(location.pathname);
</script>

以上代码输出为：

/7.11/new_file.html

window location Assign

location.assign（）方法加载新的文档。

示例

加载一个新的文档：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<input type="button" name="" id="" value="跳转到百度" onclick="newDoc()"/>
		<script type="text/javascript">
			function newDoc(){
				window.location.assign('https://www.baidu.com')
			}
		</script>
	</body>
</html>

使用javascript实现页面定时跳转---location对象

要求实现以下效果：

代码实现思路：

编写定时跳转的HTML页面。
获取指定的秒数，并减1写入页面。
当秒数大于0时，利用setTimeout()循环倒计时。
当秒数小于等于0时，利用location.href跳转到指定的URL地址中。

实现代码如下：

html代码：

css代码：

js代码：

实现效果：

以上就是关于详解window.location对象是如何实现页面跳转的？的介绍啦，需要的朋友可以参考上述内容，希望对大家有帮助，欢迎关注群英网络，小编将为大家输出更多高质量的实用文章！

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

标签： JavaScript

上一篇：详解JavaScript里面cookie操作对象的应用教程

下一篇：什么是window.screen对象应用？

推荐内容

PHP中替换第一位字符的方法和代码是什么
2022-12-14 11:21:38

Python使用中有哪些高效、实用的高级技巧
2022-08-19 17:53:01

新手学习Python有哪些关键字要掌握
2022-08-19 17:51:59

热门关键词

javascript定时器 JavaScript函数柯里化 JavaScript实现队列 JavaScript正则表达式 JavaScript基础语法 javascript整型 JavaScript常用事件 JavaScript优化技巧 JavaScript数组方法引用javascript文件 JavaScript new JavaScript变量和数据类型 JavaScript网络请求 javascript函数 JavaScript内存与性能 javascript基础学习 JavaScript循环 JavaScript WebAPI JavaScript内置对象math JavaScript的Date对象 javascript严格模式 JavaScript数字类型 JavaScript创建对象 JavaScript数据问题 JavaScript垃圾回收 JavaScript可迭代对象 javascript节点 javascript栈 JavaScript迭代器 javascript视频教程

热门信息

Python中如何求阶乘？教你四个方法
2022-02-25 17:19:26

Python怎么样创建txt文件，写入方法是什么？
2022-01-24 19:23:44

pycharm怎么完全卸载？两个步骤帮你搞定
2022-01-04 18:53:44

Java中map判断是否存在key怎样做？教你两个方法
2022-01-26 18:39:38

Python中怎样利用while求1到100的和？
2021-11-20 17:46:01

Python中的eval函数的作用是什么，怎样用？
2022-01-24 19:23:57

Java中string转date有哪些方式，怎样实现？
2022-01-18 18:00:09

Python中怎么定义数组？教你三种方法
2022-01-13 18:58:11

用python如何读取csv文件，你知道几种方法？
2021-11-22 17:53:55

python中怎样统计元素出现的次数，方法有哪些？
2021-11-20 17:45:40