[JS]window.location获取url各项参数详解
window.location方法后还还可以带href,search等参数,下面我们来看看获取url各项参数的办法。
URL即:统一资源定位符 (Uniform Resource Locator, URL)
完整的URL由这几个部分构成:
scheme://host:port/path?query#fragment
scheme:通信协议
常用的http,ftp,maito等
http://localhost/test/test.htm?id=1
代码如下 复制代码
<html>
<head>
</head>
<body>
<script languge=javascript>
alert(window.location.pathname); --返回 /test/test.htm
alert(window.location.search); --返回 ?id=1
alert(window.location.href); --返回 http://localhost/test/test.htm?id=1
</script>
</body>
</html>
location对象 含有当前URL的信息. 属性 href 整个URL字符串.
protocol 含有URL第一部分的字符串,如http:
host 包含有URL中主机名:端口号部分的字符串.如//www.cenpok.net/server/
hostname 包含URL中主机名的字符串.如http://www.cenpok.net ;
port 包含URL中可能存在的端口号字符串.
pathname URL中"/"以后的部分.如~list/index.htm
hash "#"号(CGI参数)之后的字符串.
search "?"号(CGI参数)之后的字符串.
对于这样一个URL
代码如下 复制代码
http://www.php230.com :80/fisker/post/0703/window.location.html?ver=1.0&id=6#imhere
我们可以用javascript获得其中的各个部分
1, window.location.href
整个URl字符串(在浏览器中就是完整的地址栏)
本例返回值:
代码如下 复制代码
http://www.php230.com :80/fisker/post/0703/window.location.html?ver=1.0&id=6#imhere
2,window.location.protocol
URL 的协议部分
本例返回值:http:
3,window.location.host
URL 的主机部分
本例返回值:www.php230.com
4,window.location.port
URL 的端口部分
如果采用默认的80端口(update:即使添加了:80),那么返回值并不是默认的80而是空字符
本例返回值:""
5,window.location.pathname
URL 的路径部分(就是文件地址)
本例返回值:/fisker/post/0703/window.location.html
6,window.location.search
查询(参数)部分
除了给动态语言赋值以外,我们同样可以给静态页面,并使用javascript来获得相信应的参数值
本例返回值:?ver=1.0&id=6
7,window.location.hash
锚点
本例返回值:#imhere
项目中的应用:
//获取页面根目录的下一级目录
//页面地址:http://192.168.2.98:8020/house-wap/src/main/webapp/user/userCenter.html
//所获取的地址:http://192.168.1.105:6082/house-wap/
function getRootPath(){
var pathName = window.location.pathname.substring(1);
console.log(pathName);
if(pathName == '') {
webname=''
}else{
webName=pathName.substring(0, pathName.indexOf('/'))
};
console.log(webName);
return window.location.protocol + '//' + window.location.host + '/'+ webName + '/';
}
[JS]window.location获取url各项参数详解的更多相关文章
- Arison [JS]window.location获取url各项参数详解
https://www.cnblogs.com/Arison/p/5286368.html 对于这样一个URL代码如下 复制代码 http://www.php230.com :80/fisker/po ...
- window.location获取url各项参数详解
window.location方法后还还可以带href,search等参数,下面我们来看看获取url各项参数的办法. URL即:统一资源定位符 (Uniform Resource Locator, U ...
- Angular中通过$location获取地址栏的参数详解
Angular中通过$location获取url中的参数 最近,项目开发正在进行时,心有点燥,许多东西没来得及去研究,今天正想问题呢,同事问到如何获取url中的参数,我一时半会还真没想起来,刚刚特意研 ...
- window.location获取URL中各部分
博客分类: JAVASCRIPT JavaScriptASP.netSchemeASP网络协议 URL即:统一资源定位符 (Uniform Resource Locator, URL) 完整的URL ...
- 转:asp.net获取url各项参数
假设当前页完整地址是:http://www.test.com/aaa/bbb.aspx?id=5&name=kelli "http://"是协议名 "www.te ...
- JMeter中聚合报告的各项参数详解
下面我们来共同学习这些参数的作用: 1.Lable:Label:每个 JMeter 的 element(例如 HTTP Request)都有一个 Name 属性,这里显示的就是 Name 属性的值: ...
- js获取url中参数名也参数值
要撮利用js获取url中参数名也参数值这个不多见了,但我今天需要这样操作,下面我来给大家介绍一下具体的实例方法. 在已知参数名的情况下,获取参数值,使用正则表达式能很容易做到. js的实现方法如下 ...
- js获取url的参数和值的N种有效方法
js获取url的参数和值的N种有效方法 function getParameterByName(name) { name = name.replace(/[\[]/, "\\\[" ...
- js获取url地址栏参数
前端开发中经常会遇到需要获取url地址栏参数问题 方法如下: function getQueryStringByName(name){ var src = "www.baidu.com?na ...
随机推荐
- LeetCode 290. Word Pattern (词语模式)
Given a pattern and a string str, find if str follows the same pattern. Here follow means a full mat ...
- mac 显示隐藏文件的命令行和快捷键
命令行方式: 显示隐藏文件: defaults write com.apple.Finder AppleShowAllFiles YES;KillAll Finder 不显示隐藏文件: default ...
- 143 - ZOJ Monthly, October 2015 I Prime Query 线段树
Prime Query Time Limit: 1 Second Memory Limit: 196608 KB You are given a simple task. Given a s ...
- js将图片转为base64编码,以字符串传到后台存入数据库
(前台在中approve_edit.html中,后台不变) 链接参考:http://www.cnblogs.com/Strom-HYL/p/6782176.html 该链接文中并没有用到easyUI的 ...
- geronimo
时间限制 1s 空间限制 512MB 3.1 题目描述 "Geronimo∼" 时间还很多,让我们慢慢来. 不如听首开心的歌再看题?-- 算了,直接看题吧. 给定一个整数 n,以及 ...
- node.js的模块引用
1.模块的引用示例 var math = require(‘math’): 在common.js规范中,存在require()方法,这个方法接受模块标识,此引引入一个模块的api ...
- [Swift通天遁地]六、智能布局-(7)通过Group(组)命令实现对多个视图的统一约束
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...
- Scaffold-DbContext-EFCore DB First
在使用 Scaffold-DbContext迁移数据库的时候会遇到两个问题. 一.文件已存在,其实报错很明显,增加 -force即可. 二.大小写转换,不和数据库一样了,如果要保持和数据库一致.增加 ...
- HTML--文本域,支持多行文本输入
当用户需要在表单中输入大段文字时,需要用到文本输入域. 语法: <textarea rows="行数" cols="列数">文本</texta ...
- 【洛谷2982】[Usaco2010 Feb]慢下来Slowdown(dfs序+线段树)
题目: 洛谷2982 分析: 这道题最重要的是想明白一点:牛\(i\)走到以后只对\(P_i\)的子树产生影响 知道这个以后,就可以想到在线维护每个牧场已经被"影响"了多少次(也就 ...