[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 ...
随机推荐
- JQuery之replace以及给控件赋值
<input type="hidden" name="ImgUrl" readonly="readonly"> <inpu ...
- apt --fix-broken install
1 自动修复安装出现broken的package 但是,如果还是失败的话,就需要手动进行干预了.
- audio_device模块分析
1. 对外接口 AudioDeviceModule, 採音放音接口,音量控制,静音控制等 2. 主要类 AudioDeviceModuleImpl, 对外提供的主要实现 ...
- ALSA声卡驱动中的DAPM详解之六:精髓所在,牵一发而动全身
设计dapm的主要目的之一,就是希望声卡上的各种部件的电源按需分配,需要的就上电,不需要的就下电,使得整个音频系统总是处于最小的耗电状态,最主要的就是,这一切对用户空间的应用程序是透明的,也就是说,用 ...
- system.web section group下的section
private Configuration _configuration; private ConfigurationSectionGroupCollection sectionGroups; pri ...
- 使用自定义的AlertDialog。
使用自定义的AlertDialog.1.核心的方法是setView(View view):把自己的view放置到dialog中填充.2.setCanceledOnTouchOutside(boolea ...
- JSP-Runoob:JSP 动做元素
ylbtech-JSP-Runoob:JSP 动做元素 1.返回顶部 1. JSP 动作元素 与JSP指令元素不同的是,JSP动作元素在请求处理阶段起作用.JSP动作元素是用XML语法写成的. 利用J ...
- bzoj4889
http://www.lydsy.com/JudgeOnline/problem.php?id=4889 人傻常数大 bzoj上跑不过 洛谷上能过两到三个点 我写的是树套树啊 怎么跑的比分块还慢 每次 ...
- STM32:SWD下载方式
最近没事干做了个STM32小板子,芯片是STM32VBT6,下载方式用的SWD,比JTAG节省空间 我用了五根线,3.3V,GND,RESET,SWDIO,SWCLK, JTAG 接口pin map: ...
- windows 7系统下安装SQL Server 2005图文教程
由于工作需要,今天要在电脑上安装SQL Server 2005.以往的项目都是使用Oracle,MS的数据库还真的没怎么用过,安装Oracle已经轻车熟路,但装SQL Server好像还有点小麻烦,所 ...