vue获取当前页面地址

原创已于 2023-03-27 19:46:43 修改 · 1.8w 阅读

40 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端

于 2022-09-21 17:01:36 首次发布

vue 专栏收录该内容

30 篇文章

订阅专栏

本文介绍了如何在Vue项目中利用window.location对象获取当前页面的URL、协议、域名、端口等信息，并展示了如何通过不同属性获取特定部分的URL。

1、vue获取当前页面完整地址：window.location.href

2、获取前面固定地址：window.location.host

关于window.location的详解：

　　window.location 对象不仅可以获得当前页面的地址 (URL)，还能够将浏览器重定向到新的页面。

　　下面，以http://www.xxxxxx.com:8000/test?id=123&username=xxx为例来进行解释：

　　1. window.location.href （当前url）—— http://www.xxxxxx.com:8000/test?id=123&username=xxx

　　2. window.location.protocol（协议）—— http:

　　3. window.location.host（域名 + 端口）—— www.xxxxxx.com:8000

　　4. window.location.hostname（域名）—— www.xxxxxx.com

　　5. window.location.port（端口）—— 8000

　　6. window.location.pathname（路径）—— /test

　　7. window.location.search （请求的参数）—— ?id=123&username=xxx

　　8. window.location.origin（路径前面的url）—— http://www.xxxxxx.com:8000