BOM之location对象(笔记13.1)

最新推荐文章于 2024-01-07 16:04:47 发布

前水员

最新推荐文章于 2024-01-07 16:04:47 发布

阅读量116

点赞数

分类专栏：前端 js

本文链接：https://blog.csdn.net/qq_43465434/article/details/114313119

版权

前端同时被 2 个专栏收录

35 篇文章 1 订阅

订阅专栏

28 篇文章 1 订阅

订阅专栏

location

获取当前网页文档的 URL 各个部分的信息

hash
返回URL中的锚部分
window.location.hash
host
获取URL中的主机名称和端口
window.location.host
href
返回完成的URL
window.location.href
pathname
获取URL路径名
window.location.pathname
port
获取端口号
window.location.port
protocol
返回URL协议
window.location.protocol
search
获取URL查询参数
window.location.search

用法举例：

//打印网页文档的 URL 各个部分的信息
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		
	</head>
	<body>
		<p>协议: <b id="b1"></b></p>
		<p>IP/域名: <b id="b2"></b></p>
		<p>端口: <b id="b3"></b></p>
		<p>路由地址: <b id="b4"></b></p>
		<p>查询参数: <b id="b5"></b></p>
		<p>锚点: <b id="b6"></b></p>
		<p>当前网址: <b id="b7"></b></p>
		<script type="text/javascript">
			let protocol = window.location.protocol ;
			document.getElementById("b1").innerText = protocol ;
			
			let hostname = location.hostname ;
			document.getElementById("b2").innerText = hostname ;
			
			let port = location.port ;
			document.getElementById("b3").innerText = port ;
			
			let path = location.pathname ;
			document.getElementById("b4").innerText = path ;
			
			let query = location.search ;
			document.getElementById("b5").innerText = query ;
			
			let hash = location.hash ;  
			document.getElementById("b6").innerText = hash ;
			
			let url = location.href ;
			document.getElementById("b7").innerText = url ;
		</script>
	</body>
</html>