window.location 对象中各种方法的用途
一、简介
属性 | 描述 |
---|---|
hash | 从井号 (#) 开始的 URL(锚) |
host | 主机名和当前 URL 的端口号 |
hostname | 当前 URL 的主机名 |
href | 完整的 URL |
pathname | 当前 URL 的路径部分 |
port | 当前 URL 的端口号 |
protocol | 当前 URL 的协议 |
search | 从问号 (?) 开始的 URL(查询部分) |
assign | 加载新的文档 |
二、实例
1.hash
#百度统计
window. _hmt.push(['_trackPageview', "/" + window.location.hash])
2.host
#如果端口是 80,那么就没有端口
console.log(window.location.host)
3.hostname
#只有ip,没有端口
console.log(window.location.hostname)
4.href
document.getElementById("demo").innerHTML = "页面位置是 " + window.location.href;
5.pathname
#端口/之后的全路径,如/login?name=maple&pwd=123
document.getElementById("demo").innerHTML = "页面路径是 " + window.location.pathname;
6.port
document.getElementById("demo").innerHTML = "页面端口是 " + window.location.port;
7.protocol
#一般都是http或者是https
document.getElementById("demo").innerHTML = "页面协议是 " + window.location.protocol;
8.search
#将url中?中的参数遍历出来,location.search.substring(1)的值就是 "name=maple&pwd=123"
function getQueryByKey(key) {
let query = window.location.search.substring(1);
let vars = query.split("&");
for (let i = 0; i < vars.length; i++) {
let pair = vars[i].split("=");
if (pair[0] === key) {
return pair[1];
}
}
return (false);
}
9.assign
<html>
<head>
<script>
function newDoc() {
window.location.assign("https://www.baidu.com")
}
</script>
</head>
<body> <input type="button" value="Load new document" onclick="newDoc()"> </body>
</html>
window.location 对象中各种方法的用途的更多相关文章
- JavaScript window.location对象
JavaScript window.location对象 示例 注意 方法 经常使用window.location,它的结构总是记不住,简单梳理下,方便以后查询. 示例 URL:http://b. ...
- 使用 history 对象和 location 对象中的属性和方法制作一个简易的网页浏览工具
查看本章节 查看作业目录 需求说明: 使用 history 对象和 location 对象中的属性和方法制作一个简易的网页浏览工具 实现思路: 使用history对象中的 forward() 方法和 ...
- Window Location对象
window.location 对象用于获得当前页面的地址 (URL),并把浏览器重定向到新的页面. window.location 对象在编写时可不使用 window 这个前缀. Location ...
- 2016/2/22 1、DOM的基本概念 2、Window对象操作 3、Windows.history对象 4、Window.location对象 5、Window.status对象
1.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 2.Window对象操作 一.属性和方法: 属性(值或者子对象): op ...
- window.location对象 获取页面地址
window.location对象的属性: 属性 含义 值 location.protocol 协议 "http://"或"https://" location ...
- window.location 对象所包含的属性
window.location 对象所包含的属性 属性 描述 hash 从井号 (#) 开始的 URL(锚) host 主机名和当前 URL 的端口号 hostname 当前 URL 的主机名 hre ...
- window.location.href的使用方法
http://hljqfl.blog.163.com/blog/static/40931580201122210573364/ 在写ASP.Net程序的时候,我们常常遇到跳转页面的问题,我们常常使用R ...
- request,reponse对象中的方法
1.request对象 客户端的请求信息被封装在request对象中,通过它才能了解到客户的需求,然后做出响应.它是HttpServletRequest类的实例. 序号 方 法 说 明 1 obj ...
- javascript Location对象属性和方法
Location对象 Location对象包含有关当前URL的信息 https://blog.csdn.net/u010953692/article/details/80901035#3 https( ...
随机推荐
- 使用lombok时@Setter @Getter无效
原文链接 : https://blog.csdn.net/marion158/article/details/87893480 lombok是一个帮助简化代码的工具,通过注解的形式例如@Setter ...
- java oop第14章_Swing(Java界面设计)
一. Swing相关的概念: 1. GUI:(Graphical User Interface):图形化用户界面,通过图形化的方式提供与用户交互的平台,向用户展示信息.收集用户提交的数据. 2. ...
- Windows server 2016 / Windows 10关于域管理员帐号权限不足的问题
今天在测试windows server 2016的域创建时,当安装结束之后,发现使用Administrator用户进行操作时,被提示了权限不足这个问题.于是我在百度上查找了一番之后,找到了解决方法. ...
- GarsiaWachs算法
解决石子问题: 题目描述如下: 有n堆石子排成一列,每堆石子有一个重量w[i], 每次合并可以合并相邻的两堆石子,一次合并的代价为两堆石子的重量和w[i]+w[i+1].问安排怎样的合并顺序,能够使得 ...
- 微信小程序之自定义组件
在微信小程序项目中 肯定会存在很多功能和样式上相似的部分 面对这种情况 只是单单的ctrl+c ctrl+v 就显得很low了,而且也不便于后期维护那么这时候 使用微信小程序中的自定义组件功能就很合适 ...
- Redis探索之路(三):Redis的五种数据类型String和Hash
一:String 存储二进制数据,可以图片,序列化对象 GET,SET SETNX(not exist) setnx age 33 返回 0,1 SETEX设置有效期 SETEX COLOR 2 ...
- 廖雪峰Java13网络编程-1Socket编程-2TCP编程
1. Socket 在开发网络应用程序的时候,会遇到Socket这个概念. Socket是一个抽象概念,一个应用程序通过一个Socket来建立一个远程连接,而Socket内部通过TCP/IP协议把数据 ...
- FTP 连接模式 (主动模式被动模式)
FTP是有两种传输的模式的,主动模式和被动模式,一个完整的FTP文件传输需要建立两种类型的连接,一种为文件传输下命令,称为控制连接,另一种实现真正的文件传输,称为数据连接. 1. 控制连接客户端希望与 ...
- php上传(一)
php上传基础知识总结 1.文件上传 1>文件上传的原理:将客户端上的文件通过浏览器上传到服务器上, 在将服务器上的文件移动到指定目录. 2>客户端的配置 表单页面,浏览框 method= ...
- 51 eigen、boost等基础库学习
0 引言 eigen库是一个高层次的C++库,有效支持线性代数,矩阵和矢量运算,数值分析及其相关的算法.eigen除了C++标准库之外,不需要任何其他的依赖包.Eigen使用的CMake建立配置文件和 ...