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 相关文章推荐
克隆javascript对象的三个方法小结
Jan 12 Javascript
jQuery bxCarousel实现图片滚动切换效果示例代码
May 15 Javascript
JavaScript数据类型检测代码分享
Jan 26 Javascript
详解JavaScript对W3C DOM模版的支持情况
Jun 16 Javascript
jQuery遮罩层实现方法实例详解(附遮罩层插件)
Dec 08 Javascript
基于BootStrap Metronic开发框架经验小结【四】Bootstrap图标的提取和利用
May 12 Javascript
jQuery中常用动画效果函数(日常整理)
Sep 17 Javascript
全屏滚动插件fullPage.js使用实例解析
Oct 21 Javascript
全面总结Javascript对数组对象的各种操作
Jan 22 Javascript
使用Require.js封装原生js轮播图的实现代码
Jun 15 Javascript
深入理解JavaScript的async/await
Aug 05 Javascript
Vue.js中 v-model 指令的修饰符详解
Dec 03 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
MySQL相关说明
2007/01/15 PHP
php expects parameter 1 to be resource, array given 错误
2011/03/23 PHP
Destoon旺旺无法正常显示,点击提示“会员名不存在”的解决办法
2014/06/21 PHP
深入理解PHP之源码目录结构与功能说明
2016/06/01 PHP
删除PHP数组中头部、尾部、任意元素的实现代码
2017/04/10 PHP
JavaScript的目的分析
2007/01/05 Javascript
跨浏览器通用、可重用的选项卡tab切换js代码
2011/09/20 Javascript
javascript使用中为什么10..toString()正常而10.toString()出错呢
2013/01/11 Javascript
js 获取(接收)地址栏参数值的方法
2013/04/01 Javascript
关于IE BUG与字符串截取substr的解决办法
2013/04/10 Javascript
jquery中one()方法的用法实例
2015/01/16 Javascript
JavaScript中神奇的call()方法
2015/03/12 Javascript
使用 jQuery.ajax 上传带文件的表单遇到的问题
2016/10/31 Javascript
jQuery插件zTree实现获取一级节点数据的方法
2017/03/08 Javascript
Node.js调试技术总结分享
2017/03/12 Javascript
JavaScript实现的仿新浪微博原生态输入字数即时检查功能【兼容IE6】
2017/09/26 Javascript
vue中element 上传功能的实现思路
2018/07/06 Javascript
ElementUI之Message功能拓展详解
2019/10/18 Javascript
vue实现二级导航栏效果
2019/10/19 Javascript
Vuex模块化应用实践示例
2020/02/03 Javascript
解决PyCharm中光标变粗的问题
2017/08/05 Python
python 读写中文json的实例详解
2017/10/29 Python
linux下python使用sendmail发送邮件
2018/05/22 Python
Windows下将Python文件打包成.EXE可执行文件的方法
2018/08/03 Python
Python3enumrate和range对比及示例详解
2019/07/13 Python
关于Flask项目无法使用公网IP访问的解决方式
2019/11/19 Python
Python3 把一个列表按指定数目分成多个列表的方式
2019/12/25 Python
利用python中的matplotlib打印混淆矩阵实例
2020/06/16 Python
python实现学生通讯录管理系统
2021/02/25 Python
CSS3 对过渡(transition)进行调速以及延时
2020/10/21 HTML / CSS
详解如何用canvas画一个微笑的表情
2019/03/14 HTML / CSS
水利专业大学生职业生涯规划书范文
2014/09/17 职场文书
群众路线个人剖析材料
2014/10/07 职场文书
幼儿园教师节活动总结
2015/03/23 职场文书
《祁黄羊》教学反思
2016/02/20 职场文书
一行Python命令实现批量加水印
2022/04/07 Python