javascript Location对象

location 对象包含当前URL的信息

location 对象是window 对象的一部分,可通过window.Location属性对其进行访问
ps: 没有应用于Location对象的公开标准,不过所有的浏览器都支持该都改对象

location的对象属性

属性描述
hash返回一个URL的锚部分
host返回一个URL主机名和端口
hostname返回URL的主机名
href
pathname
port
protocol
search

location的对象方法

方法说明
assign()载入一个新的文档
reload()重新载入当前的文档
replace()用新的文档替换当前文档

hash属性

hash属性是一个可读可写的字符串,该字符串是URL的锚部分(从#号开始的地方)
location.hash (所有的浏览器都支持hash属性)
返回一个URL的部分。假设当前的URL是:
http://www.xxx.xx/test#ssgao1987
<script>
  console.log(location.hash);//输出为#ssgao1987
</script>

host属性

host属性是一个可读可写的字符串,可设置或返回当前URL的主机名称和端口
location.host (所有的浏览器都支持host属性)

返回当前URL的主机名和端口
http://www.baidu.com/ssgao1987
<script>
 console.log(location.host); //返回的结果为:www.baidu.com
</script>

hostname属性

hostname属性是一个可读可写的字符串,可设置或返回当前URL的主机名
location.hostname(所有主要的浏览器都支持)
返回当前URL的主机名
http://www.baidu.com/ssgao1987
<script>
 console.log(location.host); //返回的结果为:www.baidu.com
</script>

href属性

href属性是一个可读可写字符串,可设置或返回当前显示的文档的完整的URL
location.href(所有的浏览器都支持)
返回完整的URL(当前页):
例如:http://www.baidu.com/ssgao1987
<script>
  console.log(location.href);
</script>
输出的结果:
  http://www.baidu.com/ssgao1987

pathname属性

pathname属性是一个可读可写的字符串,可设置或返回当前URL的路径部分
location.pathname(所有的浏览器都支持)
返回当前URL的路径名
http://www.baidu.com/ssgao1987
<script>
   console.log(location.pathname);
</script>
输出的结果为:/ssgao1987

port属性

port属性是一个可读可写的字符串,可设置或返回当前URL的端口部分
ps:如果端口就是80(这是默认的端口)无需指定
location.port(所有的浏览器都支持)
返回当前URL的端口号
http://127.0.0.1:8090/ssgao
<script>
  document.write(location.port);
</script>
输出结果为:8090

protocol属性

protocol属性是一个可读可写的字符串,可设置或返回当前URL的协议
location.protocol (所有的浏览器都支持)
返回当前URL的协议部分
<script>
 console.log(location.protocol); 
<script>
输出的结果: http1.1

search属性

search属性是一个可读可写的字符串,可设置或返回当前URL的查询部分(问号?之后的部分)
location.search(所有的浏览器都支持)
返回URL的查询部分,假如当前的URL就是http://www.baidu.com/ssgao?name=aouo&age=34
<script>
  console.log(location.search);
</script>
输出的结果为:?name=aouo&age=34

assign()方法

该方法用于重新加载一个新的文档
location.assign(URL)(所有的浏览器都支持assign()方法)
<!DOCTYPE html> 
<html> 
<head> 
<script> 
##加载一个新的文档
function newDoc(){ 
    window.location.assign("http://www.baidu.com") 
} 
</script> 
</head> 
<body> 
##点击载入新的文档
<input type="button" value="载入新文档" onclick="newDoc()"> 
</body> 
</html>

reload()方法

reload()方法用于刷新当前文档,类似与浏览器上的刷新按钮

所有的主要浏览器都支持reload()方法
location.reload(forceGet)

forceGet booean 类型

可选,如果该方法的参数设置为true,那么无论文档的最后修改日期是什么,它都会绕过缓存,从服务器上重新下载该文档,这与用户在单击浏览器的刷新按钮是按住shift按键的效果一样

replace()方法

replace()方法可用一个新的文档取代当前的文档
location.replace(newURL);(所有的浏览器都支持)
<!DOCTYPE html> 
<html> 
<head> 
<script>
## 替换当前文档内容 
function replaceDoc(){ 
    window.location.replace("http://www.runoob.com") 
} 
</script> 
</head> 
<body> 
<input type="button" value="载入新文档替换当前页面" onclick="replaceDoc()"> 
</body> 
</html>

转载于:https://www.cnblogs.com/ssgao/p/8868606.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值