JavaScript获取URL汇总


Posted in Javascript onJune 08, 2015

URL即统一资源定位符 (Uniform Resource Locator, URL),完整的URL由这几个部分构成:

scheme://host:port/path?query#fragment
scheme:通信协议,常用的http,ftp,maito等。
host:主机,服务器(计算机)域名系统 (DNS) 主机名或 IP 地址。
port:端口号,整数,可选,省略时使用方案的默认端口,如http的默认端口为80。
path:路径,由零或多个"/"符号隔开的字符串,一般用来表示主机上的一个目录或文件地址。
query:查询,可选,用于给动态网页(如使用CGI、ISAPI、PHP/JSP/ASP/ASP.NET等技术制作的网页)传递参数,可有多个参数,用"&"符号隔开,每个参数的名和值用"="符号隔开。
fragment:信息片断,字符串,用于指定网络资源中的片断。例如一个网页中有多个名词解释,可使用fragment直接定位到某一名词解释。(也称为锚点)

下面我们举例一个URL,然后获得它的各个组成部分。
https://3water.com/newsDetail.php?id=65

window.location.href

可以获得整个URL字符串(在浏览器中就是完整的地址栏)。

var test = window.location.href;
alert(test);

程序返回 https://3water.com/newsDetail.php?id=65

window.location.protocol

可以获得 URL 的协议部分

var test = window.location.protocol;
alert(test);

程序返回 http:

window.location.host

可以获得 URL 的主机部分

var test = window.location.host;
alert(test);

程序返回 3water.com

window.location.port
可以获得 URL 的端口部分

var test = window.location.port;
alert(test);

如果采用默认的80端口(update:即使添加了:80),那么返回值并不是默认的80而是空字符。

window.location.pathname
获得 URL 的路径部分(就是文件地址)

var test = window.location.pathname;
alert(test);

window.location.search
获得查询(参数)部分,除了给动态语言赋值以外,我们同样可以给静态页面,并使用javascript来获得相信应的参数值。

var test = window.location.search;
alert(test);

window.location.hash

获得锚点。

var test = window.location.hash;
alert(test);

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
在IE下:float属性会影响offsetTop的取值
Dec 22 Javascript
根据json字符串生成Html的一种方式
Jan 09 Javascript
js 编码转换 gb2312 和 utf8 互转的2种方法
Aug 07 Javascript
非jQuery实现照片散落桌子上,单击放大的LightBox效果
Nov 28 Javascript
javascript中eval函数用法分析
Apr 25 Javascript
理解JavaScript事件对象
Jan 25 Javascript
BootStrap智能表单实战系列(九)表单图片上传的支持
Jun 13 Javascript
jquery获取easyui日期控件的值实现方法
Nov 09 Javascript
微信小程序  TLS 版本必须大于等于1.2问题解决
Feb 22 Javascript
jQuery插件FusionCharts绘制2D柱状图和折线图的组合图效果示例【附demo源码】
Apr 10 jQuery
详解React项目中碰到的IE问题
Mar 14 Javascript
javascript实现前端分页功能
Nov 26 Javascript
详解JavaScript中的forEach()方法的使用
Jun 08 #Javascript
详解JavaScript中的every()方法
Jun 08 #Javascript
JavaSciprt中处理字符串之sup()方法的使用教程
Jun 08 #Javascript
javaScript中with函数用法实例分析
Jun 08 #Javascript
简介JavaScript中的sub()方法的使用
Jun 08 #Javascript
简介JavaScript中strike()方法的使用
Jun 08 #Javascript
JavaScript中的small()方法使用详解
Jun 08 #Javascript
You might like
PHP memcache扩展的三种安装方法
2009/04/26 PHP
ThinkPHP水印功能实现修复PNG透明水印并增加JPEG图片质量可调整
2014/11/05 PHP
YII2框架中使用yii.js实现的post请求
2017/04/09 PHP
jquery pagination插件实现无刷新分页代码
2009/10/13 Javascript
页面中js执行顺序
2009/11/09 Javascript
Chrome下ifame父窗口调用子窗口的问题示例探讨
2014/03/17 Javascript
jQuery过滤选择器详解
2015/01/13 Javascript
通过实例理解javascript中没有函数重载的概念
2015/06/03 Javascript
JS根据key值获取URL中的参数值及把URL的参数转换成json对象
2015/08/26 Javascript
jQuery实现区域打印功能代码详解
2016/06/17 Javascript
微信小程序 教程之条件渲染
2016/10/18 Javascript
vuejs2.0子组件改变父组件的数据实例
2017/05/10 Javascript
React Native中导航组件react-navigation跨tab路由处理详解
2017/10/31 Javascript
vue中uni-app 实现小程序登录注册功能
2019/10/12 Javascript
javascript设计模式 ? 工厂模式原理与应用实例分析
2020/04/09 Javascript
举例区分Python中的浅复制与深复制
2015/07/02 Python
使用numba对Python运算加速的方法
2018/10/15 Python
在unittest中使用 logging 模块记录测试数据的方法
2018/11/30 Python
PyCharm 设置SciView工具窗口的方法
2019/01/15 Python
python的pyecharts绘制各种图表详细(附代码)
2019/11/11 Python
pytorch模型存储的2种实现方法
2020/02/14 Python
Python3打包exe代码2种方法实例解析
2020/02/17 Python
Python 获取异常(Exception)信息的几种方法
2020/12/29 Python
美国汽车性能部件和赛车零件网站:Vivid Racing
2018/03/27 全球购物
哥德堡通行证:Gothenburg Pass
2019/12/09 全球购物
药店主任岗位责任制
2014/02/10 职场文书
师范生自我鉴定
2014/03/20 职场文书
投标授权委托书范文
2014/08/02 职场文书
2014年语文教学工作总结
2014/12/17 职场文书
逃课检讨书怎么写
2015/01/01 职场文书
公司总经理岗位职责
2015/04/01 职场文书
本科毕业论文致谢词
2015/05/14 职场文书
土木工程毕业答辩开场白
2015/05/29 职场文书
2016年记者节感言
2015/12/08 职场文书
2016党员学习心得体会范文
2016/01/23 职场文书
Python学习之包与模块详解
2022/03/19 Python