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 相关文章推荐
TreeView 用法(有代码)(asp.net)
Jul 15 Javascript
基于jquery的$.ajax async使用
Oct 19 Javascript
基于jQuery的简单九宫格实现代码
Aug 09 Javascript
jQuery层动画定位滑动效果的方法
Apr 30 Javascript
node.js中的事件处理机制详解
Nov 26 Javascript
很棒的vue弹窗组件
May 24 Javascript
vue中实现图片和文件上传的示例代码
Mar 16 Javascript
Angular(5.2->6.1)升级小结
Dec 27 Javascript
vue ajax 拦截原理与实现方法示例
Nov 29 Javascript
js实现登录拖拽窗口
Feb 10 Javascript
《javascript设计模式》学习笔记一:Javascript面向对象程序设计对象成员的定义分析
Apr 07 Javascript
JavaScript 语句之常用 for 循环详解
Mar 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
PHP 远程关机实现代码
2009/11/10 PHP
深入解析phpCB批量转换的代码示例
2013/06/27 PHP
PHP中实现生成静态文件的方法缓解服务器压力
2014/01/07 PHP
PHP 动态生成静态HTML页面示例代码
2014/01/15 PHP
codeigniter自带数据库类使用方法说明
2014/03/25 PHP
PHP使用递归生成文章树
2015/04/21 PHP
php算法实例分享
2015/07/14 PHP
编写PHP程序检查字符串中的中文字符个数的实例分享
2016/03/17 PHP
针对多用户实现头像上传功能PHP代码 适用于登陆页面制作
2016/08/17 PHP
JavaScript 对话框和状态栏使用说明
2009/10/25 Javascript
网站如何做到完全不需要jQuery也可以满足简单需求
2013/06/27 Javascript
javaScript array(数组)使用字符串作为数组下标的方法
2013/11/19 Javascript
jQuery实现单击和鼠标感应事件
2015/02/01 Javascript
js实现两点之间画线的方法
2015/05/12 Javascript
vue webuploader 文件上传组件开发
2017/09/23 Javascript
ES6扩展运算符用法实例分析
2017/10/31 Javascript
JS函数节流和函数防抖问题分析
2017/12/18 Javascript
vue组件传递对象中实现单向绑定的示例
2018/02/28 Javascript
vue移动端项目缓存问题实践记录
2018/10/29 Javascript
通过vue手动封装on、emit、off的代码详解
2019/05/29 Javascript
vuejs中父子组件之间通信方法实例详解
2020/01/17 Javascript
JS求解两数之和算法详解
2020/04/28 Javascript
[47:52]完美世界DOTA2联赛PWL S2 PXG vs InkIce 第二场 11.26
2020/11/30 DOTA
python 文件与目录操作
2008/12/24 Python
简单介绍Python中利用生成器实现的并发编程
2015/05/04 Python
Python中特殊函数集锦
2015/07/27 Python
TensorFlow通过文件名/文件夹名获取标签,并加入队列的实现
2020/02/17 Python
python实现飞机大战项目
2020/03/11 Python
Python 实现网课实时监控自动签到、打卡功能
2020/03/12 Python
哈弗商学院毕业生求职信
2014/02/26 职场文书
公司总经理助理岗位职责
2014/07/09 职场文书
节约用电倡议书
2015/04/28 职场文书
运动会报道稿大全
2015/07/23 职场文书
私人贷款担保书该怎么写呢?
2019/07/02 职场文书
HTML5中 rem适配方案与 viewport 适配问题详解
2021/04/27 HTML / CSS
深入理解go slice结构
2021/09/15 Golang