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 相关文章推荐
用jquery和json从后台获得数据集的代码
Nov 07 Javascript
JavaScript起点(严格模式深度了解)
Jan 28 Javascript
jQuery创建平滑的页面滚动(顶部或底部)
Feb 26 Javascript
js实现按钮控制图片360度翻转特效的方法
Feb 17 Javascript
jquery中JSON的解析方式
Mar 16 Javascript
基于jquery实现简单的分页控件
Mar 17 Javascript
JQuery插件Marquee.js实现无缝滚动效果
Apr 26 Javascript
基于JavaScript实现淘宝商品广告效果
Aug 10 Javascript
node实现基于token的身份验证
Apr 09 Javascript
iconfont的三种使用方式详解
Aug 05 Javascript
Vue中 axios delete请求参数操作
Aug 25 Javascript
如何利用JS将手机号中间四位变成*号
Sep 29 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
一个简单的自动发送邮件系统(二)
2006/10/09 PHP
php面向对象全攻略 (十) final static const关键字的使用
2009/09/30 PHP
php设计模式 Command(命令模式)
2011/06/26 PHP
php数组函数序列之in_array() - 查找数组中是否存在指定值
2011/11/07 PHP
深入解析php中的foreach问题
2013/06/30 PHP
php中{}大括号是什么意思
2013/12/01 PHP
PHP 提取图片img标记中的任意属性的简单实例
2013/12/10 PHP
PHP代码判断设备是手机还是平板电脑(两种方法)
2015/10/19 PHP
教你php如何实现验证码
2016/01/20 PHP
利用PHP如何写APP接口详解
2016/08/23 PHP
编写兼容IE和FireFox的脚本
2009/05/18 Javascript
javascript 全等号运算符使用说明
2010/05/31 Javascript
解决JS浮点数运算出现Bug的方法
2013/03/12 Javascript
javascript获取ckeditor编辑器的值(实现代码)
2013/11/18 Javascript
js中直接声明一个对象的方法
2014/08/10 Javascript
javascript实现随时变化着的背景颜色
2015/04/02 Javascript
JavaScript浮点数及运算精度调整详解
2016/10/21 Javascript
Jquery实现跨域异步上传文件总结
2017/02/03 Javascript
详解AngularJS 模块化
2017/06/14 Javascript
js轮播图无缝滚动效果
2017/06/17 Javascript
jQuery选择器特殊字符与属性空格问题
2017/08/14 jQuery
在Vue中获取组件声明时的name属性方法
2018/09/12 Javascript
vue富文本编辑器组件vue-quill-edit使用教程
2018/09/21 Javascript
利用JavaScript缓存远程窃取Wi-Fi密码的思路详解
2018/11/05 Javascript
微信小程序弹窗禁止页面滚动的实现代码
2020/12/30 Javascript
[02:40]DOTA2超级联赛专访430 从小就爱玩对抗性游戏
2013/06/18 DOTA
利用Django框架中select_related和prefetch_related函数对数据库查询优化
2015/04/01 Python
Python反射的用法实例分析
2018/02/11 Python
python学生管理系统开发
2019/01/30 Python
CSS3圆角和渐变2种常用功能详解
2016/01/06 HTML / CSS
KOHLER科勒美国官网:国际著名卫浴橱柜领先品牌
2020/06/27 全球购物
程序集与命名空间有什么不同
2014/07/25 面试题
财务人员求职自荐书范文
2014/02/10 职场文书
幼儿园儿童节主持词
2014/03/21 职场文书
趣味运动会广播稿
2015/08/19 职场文书
SQL Server远程连接的设置步骤(图文)
2022/03/23 SQL Server