window.location.href(当前URL)

结果如下:
http://www.myurl.com:8866/test?id=123&username=xxx

window.location.protocol(协议)

结果如下:
http:

window.location.host(域名 + 端口)

结果如下:
www.myurl.com:8866

window.location.hostname(域名)

结果如下:
www.myurl.com

window.location.port(端口)

结果如下:
8866

window.location.pathname(路径部分)

结果如下:
/test

window.location.search(请求的参数)

结果如下:
?id=123&username=xxx

通常由于业务需要,前端页面中的某个数据源来源,需要我们去获取URL的某个参数值。这时封装一个输入参数名获取对应参数值的函数是必不可少的,如下所示:

function getQuery(name) {
// 正则:[找寻'&' + 'url参数名字' = '值' + '&']('&'可以不存在)
let reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
let r = window.location.search.substr().match(reg);//substr() 的参数指定的是子串的开始位置和长度,因此它可以替代 substring() 和 slice() 来使用,但是它没有标准化
if(r != null) {
// 对参数值进行解码
return unescape(r[]);
}
return null;
} // 调用方法,注意需要传入String类型的数据,输出结果为String类型
getQuery('id'); // '123'

不过unescape解码方法已经废除了。注释:ECMAScript v3 已从标准中删除了 unescape() 函数,并反对使用它,因此应该用 decodeURI() 和 decodeURIComponent() 取而代之。

window.location.origin('?'前边的URL)

结果如下:
http://www.myurl.com:8866

链接:https://www.jianshu.com/p/c9324d237a8e

window.location对象详解的更多相关文章

  1. JS代码的window.location属性详解

    转载:http://www.5icool.org/a/201105/a564.html 如果你稍微懂一些JS代码,一般都会知道 window.location.href 这个属性.并且用该属性获取页面 ...

  2. 火狐和IE的window.event对象详解(转载)

    FF的FIREBUG,不仅能测试JS还能检查CSS错误,是一般常用的. 但它主要检查FF方面的错误,对IE就无能为力了. 要测试IE,就用ieTester,它可以测试IE几乎所有版本(1.0恐怕也用不 ...

  3. window.location.href详解

    在写web程序的时候,我们经常遇到跳转页面的问题,我们经常使用Response.Redirect做页面跳转,如果客户要在跳转的时候使用提示,这个就不灵光了,如: Response.Write(&quo ...

  4. window.XMLHttpRequest对象详解

    来自:http://blog.csdn.net/lccone/article/details/7743946 window.XMLHttpRequest XMLHttpRequest对象是当今所有AJ ...

  5. JavaScript基础知识之——Location 对象详解

    属性 描述 location.hash 设置或取得 URL 中的锚 location.host 设置或取得 URL 中主机(包括端口号) location.hostname 设置或取得 URL 中的主 ...

  6. Window 对象详解 转自 http://blog.csdn.net/jcx5083761/article/details/41243697

    详解HTML中的window对象和document对象 标签: HTMLwindowdocument 2014-11-18 11:03 5884人阅读 评论(0) 收藏 举报 分类: HTML& ...

  7. ActiveXObject对象详解

    一.什么是 ActiveX 控件?         ActiveX 控件广泛用于 Internet.它们可以通过提供视频.动画内容等来增加浏览的乐趣.不过,这些程序可能出问题或者向您提供不需要的内容. ...

  8. window.onload用法详解:

    网页中的javaScript脚本代码往往需要在文档加载完成后才能够去执行,否则可能导致无法获取对象的情况,为了避免这种情况的发生,可以使用以下两种方式: 一.将脚本代码放在网页的底端,这样在运行脚本代 ...

  9. JS中的event 对象详解

    JS中的event 对象详解   JS的event对象 Event属性和方法:1. type:事件的类型,如onlick中的click:2. srcElement/target:事件源,就是发生事件的 ...

随机推荐

  1. Apache poi 使用经验分享

    我在使用apache poi导入导出Excel做项目过程中,遇到了许许多多的问题,在此简单罗列. 1.xls和xlsx的区分:poi将2003以前和2007以后的excel封装成了两个不同的实现:HS ...

  2. HDU1281(KB10-D 二分图最大匹配)

    棋盘游戏 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submis ...

  3. LeetCode DB: Duplicate Emails

    Write a SQL query to find all duplicate emails in a table named Person. +----+---------+ | Id | Emai ...

  4. Date类型错误

    今天写代码的时候遇到一个很蛋疼的问题,明明实体类写的是Date型,文本框也是date型,数据库中对应的列是dateTime类型,这原本进行数据录入或者是修改这个操作是不应该出错的,但是一时没找到解决的 ...

  5. <Android 基础(三十三)> TabHost ~ 仿微信底部菜单

    简介 Container for a tabbed window view. This object holds two children: a set of tab labels that the ...

  6. 我正在参加 CSDN 2018 年博客之星评选,希望大家能支持我

    我正在参加 CSDN 2018 年博客之星评选,希望大家能支持我 我是[No. 001]号,感谢大家宝贵的一票 ^_^/ 投票地址:https://bss.csdn.net/m/topic/blog_ ...

  7. 【转】python version 2.7 required,which was not found in the registry

    源地址:http://www.cnblogs.com/thinksasa/archive/2013/08/26/3283695.html 方法:新建一个register.py 文件,把一下代码贴进去, ...

  8. 解决 ModuleNotFoundError: No module named 'pip'

    安装其它python包时,提示说 pip 10.0.1可用,就更新了一下,但是 更新过程中出现了错误,如图所示 因为这个错误导致 pip找不到, 可以首先执行  python -m ensurepip ...

  9. 购物商城学习--第三讲(tomcat插件启动web工程)

    此处提到的tomcat插件即maven工程集成的tomcat插件,可以在添加maven的tomcat插件之后,在本地通过脚本或者命令行方式运行web工程,tomcat插件启动只需要修改一个端口即可,非 ...

  10. MSCRM2016 取消邮箱强制SSL

    在新建电子邮件服务器配置文件时Advanced中的Use SSL for Incoming/Outgoing Connection默认都是启用的而且无法编辑,启用SSL当然是为了安全的考虑,但当客户的 ...