前端开发中常用到window.location对象,该对象包含了当前页面的URL信息。下面详细讲解window.location对象所包含的属性及其作用:
前端开发中常用到window.location对象,该对象包含了当前页面的URL信息。下面详细讲解window.location对象所包含的属性及其作用:
window.location.href
window.location.href返回当前页面的URL地址,也可以修改该属性来跳转页面。
示例1:
//返回当前页面URL
console.log(window.location.href);
//跳转到百度首页
window.location.href = "http://www.baidu.com";
window.location.protocol
window.location.protocol返回当前页面所使用的协议,如HTTP或HTTPS。在修改该属性时,应加上“:”符号,如window.location.protocol = "https:"。
示例2:
//返回当前页面使用的协议
console.log(window.location.protocol);
window.location.host
window.location.host返回当前页面的主机名和端口号,不包含协议名。在修改该属性时,应注意不要带有协议名。
示例3:
//返回当前页面的主机名及端口号
console.log(window.location.host);
window.location.hostname
window.location.hostname返回当前页面所在域名,不包含端口号和协议名。
示例4:
//返回当前页面所在的域名
console.log(window.location.hostname);
window.location.port
window.location.port返回当前页面所使用的端口号,如果没有指定端口,则返回空字符串。
示例5:
//返回当前页面使用的端口号
console.log(window.location.port);
window.location.pathname
window.location.pathname返回当前页面所在的路径,不包含主机名、协议和查询字符串,但包含开始的“/”符号。
示例6:
//返回当前页面的路径
console.log(window.location.pathname);
window.location.search
window.location.search返回当前页面的查询字符串,也就是URL中问号后面的部分。
示例7:
//返回当前页面的查询字符串
console.log(window.location.search);
window.location.hash
window.location.hash返回当前页面的哈希值,也就是URL中#号后面的部分。
示例8:
//返回当前页面的哈希值
console.log(window.location.hash);
这些是window.location对象所包含的属性,可以根据具体需要进行调用。
本文标题为:window.location 对象所包含的属性
基础教程推荐
- DIV+CSS网页制作布局技巧学习 2023-12-08
- JS Jquery 遍历,筛选页面元素 自动完成(实现代码) 2023-12-01
- Ajax请求二进制流进行处理(ajax异步下载文件)的简单方法 2023-02-14
- jQuery AJAX实现调用页面后台方法 2022-12-28
- 块元素block element和内联元素inline element 2022-10-16
- 组合CLASS来完成网页布局风格 2022-10-16
- vue3 computed 2023-10-08
- 怎么通过CSS定义项目列表li前小点( · )的样式 2022-07-07
- Vuex的概念和作用解析 2023-10-08
- vue post application/x-www-form-urlencoded传参的解决方案 2023-10-08
