JS如何获取地址栏的参数实例讲解


Posted in Javascript onOctober 06, 2018

地址:http://127.0.0.1:8082/prosperleedir/index.html?id=6666&name=prosper#prosper

Location{

 assign:ƒ (),         // 加载新的文档。

 hash:"#prosper",       // 设置或返回从井号 (#) 开始的 URL(锚)。

 host:"127.0.0.1:8082",    // 设置或返回主机名和当前 URL 的端口号。

 hostname:"127.0.0.1",     // 设置或返回当前 URL 的主机名。

 href:"http://127.0.0.1:8082/prosperleedir/index.html?id=6666&name=prosper#prosper",   // 设置或返回完整的 URL。

 origin:"http://127.0.0.1:8082",    // 返回当前 URL 的协议和主机名和当前 URL 的端口号。

 pathname:"/prosperleedir/index.html",      // 设置或返回当前 URL 的路径部分。

 port:"8082",       // 设置或返回当前 URL 的端口号。

 protocol:"http:",      // 设置或返回当前 URL 的协议。

 reload:ƒ reload(),      // 重新加载当前文档。

 replace:ƒ (),       // 用新的文档替换当前文档。

 search:"?id=6666&name=prosper",     // 设置或返回从问号 (?) 开始的 URL(查询部分)。

 toString:ƒ toString(),      // 返回完整的 URL。

}

加载新的文档。

window.location.assign(http://www.baidu.com);

用新的文档替换当前文档。

window.location.replace(http://www.baidu.com);

重新加载当前文档。

如果该方法没有规定参数,或者参数是 false,它就会用 HTTP 头 If-Modified-Since 来检测服务器上的文档是否已改变。如果文档已改变,reload() 会再次下载该文档。如果文档未改变,则该方法将从缓存中装载文档。这与用户单击浏览器的刷新按钮的效果是完全一样的。

如果把该方法的参数设置为 true,那么无论文档的最后修改日期是什么,它都会绕过缓存,从服务器上重新下载该文档。这与用户在单击浏览器的刷新按钮时按住 Shift 健的效果是完全一样。

window.location.reload(true);

window.location.reload(false);

返回完整的 URL。

console.log(window.location.toString());

JS如何获取地址栏的参数实例讲解

/**

     * [getUrlParam 获取地址栏传参]

     * @param {[String]} paramname [参数名]

     * @return {[String]}      [参数值]

     */

    function getUrlParam(paramname) {

           

      var reg = new RegExp("(^|&)" + paramname + "=([^&]*)(&|$)");

 

      // 查询匹配 substr(1)删除? match()匹配

      var s = window.location.search.substr(1).match(reg);

 

      if (s != null) {

 

        return unescape(s[2]); // unescape() 函数可对通过 escape() 编码的字符串进行解码。

 

      }

 

      return null;

 

    }

 

    // ?id=6666&name=prosper

    getUrlParam('id'); // s的输出为["id=6666&","","6666","&"]

    getUrlParam('name'); // s的输出为["name=prosper","&","prosper",""]
Javascript 相关文章推荐
文本框中禁止非数字字符输入比如手机号码、邮编
Aug 19 Javascript
node.js中的buffer.fill方法使用说明
Dec 14 Javascript
兼容各大浏览器的JavaScript阻止事件冒泡代码
Jul 09 Javascript
两款JS脚本判断手机浏览器类型跳转WAP手机网站
Oct 16 Javascript
knockoutjs动态加载外部的file作为component中的template数据源的实现方法
Sep 01 Javascript
js Canvas实现的日历时钟案例分享
Dec 25 Javascript
[js高手之路]寄生组合式继承的优势详解
Aug 28 Javascript
HTML5+JS+JQuery+ECharts实现异步加载问题
Dec 16 jQuery
使用react实现手机号的数据同步显示功能的示例代码
Apr 03 Javascript
Element ui 下拉多选时新增一个选择所有的选项
Aug 21 Javascript
node 解析图片二维码的内容代码实例
Sep 11 Javascript
jquery实现购物车基本功能
Oct 25 jQuery
详谈js的变量提升以及使用方法
Oct 06 #Javascript
浅析js中mvvm模式实现的原理
Oct 06 #Javascript
js for终止循环 跳出多层循环
Oct 04 #Javascript
iView-admin 动态路由问题的解决方法
Oct 03 #Javascript
Angular resolve基础用法详解
Oct 03 #Javascript
解决angularjs service中依赖注入$scope报错的问题
Oct 02 #Javascript
angular.js实现列表orderby排序的方法
Oct 02 #Javascript
You might like
PHP调用Linux的命令行执行文件压缩命令
2013/01/27 PHP
file_get_contents("php://input", "r")实例介绍
2013/07/01 PHP
php简单创建zip压缩文件的方法
2016/04/30 PHP
PHP检测数据类型的几种方法(总结)
2017/03/04 PHP
简单实用的PHP文本缓存类实例
2019/03/22 PHP
解决laravel5.4下的group by报错的问题
2019/10/16 PHP
正则表达式判断是否存在中文和全角字符和判断包含中文字符串长度
2008/09/27 Javascript
JavaScript Event事件学习第一章 Event介绍
2010/02/07 Javascript
C#中TrimStart,TrimEnd,Trim在javascript上的实现
2011/01/17 Javascript
js实现iframe跨页面调用函数的方法
2014/12/13 Javascript
在Html中使用Requirejs进行模块化开发实例详解
2016/04/15 Javascript
聊一聊JavaScript作用域和作用域链
2016/05/03 Javascript
jQuery实现的表格展开伸缩效果实例
2016/09/07 Javascript
Json对象和字符串互相转换json数据拼接和JSON使用方式详细介绍(小结)
2016/10/25 Javascript
js实现键盘自动打字效果
2016/12/23 Javascript
jQuery Pagination分页插件_动力节点Java学院整理
2017/07/17 jQuery
jQuery NProgress.js加载进度插件的简单使用方法
2018/01/31 jQuery
浅谈React 服务器端渲染的使用
2018/05/08 Javascript
浅谈使用mpvue开发小程序需要注意和了解的知识点
2018/05/23 Javascript
JavaScript设计模式之代理模式简单实例教程
2018/07/03 Javascript
vue+elementUI动态生成面包屑导航教程
2019/11/04 Javascript
[01:55]2014DOTA2国际邀请赛快报:国土生病 紧急去医院治疗
2014/07/10 DOTA
[02:05]DOTA2完美大师赛趣味视频之看我表演
2017/11/18 DOTA
浅析Git版本控制器使用
2017/12/10 Python
基于Python的Post请求数据爬取的方法详解
2019/06/14 Python
python利用tkinter实现屏保
2019/07/30 Python
python实现图片压缩代码实例
2019/08/12 Python
Python实现ATM系统
2020/02/17 Python
Django-simple-captcha验证码包使用方法详解
2020/11/28 Python
使用CSS3来绘制一个月食图案
2015/07/18 HTML / CSS
HTML5标签使用方法详解
2015/11/27 HTML / CSS
Kangol帽子官网:坎戈尔袋鼠
2018/09/26 全球购物
趣味比赛活动方案
2014/02/15 职场文书
大学班级学风建设方案
2014/05/01 职场文书
公司募捐倡议书
2014/05/14 职场文书
党员批评与自我批评范文
2014/09/23 职场文书