现在许多的主流网站都将'#'大规模用于重要URL中,我们通过正则表达式和window.location.search获取参数已经行不通了。

一.'#'号是什么

1.#代表网页中的一个位置。其后面的字符,就是该位置的标识符。

2.#是用来指导浏览器动作的,对服务器端完全无用。所以,HTTP请求中不包括#。

3.在第一个#后面出现的任何字符,都会被浏览器解读为位置标识符。这意味着,这些字符都不会被发送到服务器端。

4.单单改变#后的部分,浏览器只会滚动到相应位置,不会重新加载网页。

5.每一次改变#后的部分,都会在浏览器的访问历史中增加一个记录,使用"后退"按钮,就可以回到上一个位置。

二.如何获取#号后的字符串

1.window.location.search:获取当前URL的'?'号开始的字符串

2.window.location.hash:获取当前URL的'#'后面的字符串

三.js代码

1.获取链接后的参数(不带#号)

getQueryString(name) {
   let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
let r = window.location.search.substr(1).match(reg);
if (r != null) return decodeURIComponent(r[]);
return null;
}

2.获取链接后的参数(带#号)

getQueryString(name) {
let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
if(window.location.hash.indexOf("?") < ){
return null;
}
let r = window.location.hash.split("?")[].match(reg);   
if (r != null) return decodeURIComponent(r[]);
   return null;
}

3.使用方法

console.log('name is ',getQueryString('name'))
感谢您的阅读,如果您觉得阅读本文对您有帮助,请点一下“推荐”按钮。本文欢迎各位转载,但是转载文章之后必须在文章页面中给出作者和原文连接

js获取带#号链接后的参数的更多相关文章

  1. js获取或设置当前窗口url参数

    直接上代码 // 获取当前窗口url中param参数的值 function get_param(param){ var query = location.search.substring(1).spl ...

  2. 现代浏览器原生js获取id号方法

    <div id="tests" class="a b c" style="color:#f00">123</div> ...

  3. 前端页面js与flash交互——js获取flash对象,并传递参数

    背景介绍: 最近在搞一个项目,涉及到图片选取,裁剪,上传等,由于浏览器安全性问题,js无法获取到<input type="file">中选取的文件路径,而且对照片的裁剪 ...

  4. js 获取页面内链接

    今天有同学问如何用 JS 正则表达式获取一段文本中的超链接,并对超链接进行处理,想了几分钟,写了下面的代码: var re = /https?:\/\/[\w\.:~\-\d\/]+(?:\?[\w\ ...

  5. js获取指定字符前/后的字符串简单实例

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  6. [转]js获取iframe通过url传递的参数

    1.前言 获取iframe的url路径:window.parent.document.getElementById("your-iframe-id").contentWindow. ...

  7. H5_0016:js获取网络中配置文件中的参数

         //获取网络配置文件中的参数      $.get("https://cdn.com/share.json", function(e) {       //console ...

  8. js获取URL地址中的GET参数

    var $_GET = (function(){ var url = window.document.location.href.toString(); var u = url.split(" ...

  9. js篇-解析url链接里面的参数名和参数值

    项目背景是,链接为:https://paladin.pingan.com.cn/jf/?appId=PA00200000000_01_APP&id=123456#/fundRank 要求拿到: ...

随机推荐

  1. trinitycore 魔兽服务器源码分析(二) 网络

    书接上文 继续分析Socket.h SocketMgr.h template<class T>class Socket : public std::enable_shared_from_t ...

  2. cms后台管理

    {项目名称:cms}-后台管理系统 项目阶段性总结报告 1 项目信息 开发工具:eclinpse,mysql,foxmail 使用到的技术:springMVC,springJDBC,maven,fre ...

  3. API网关设计(一)之Token多平台身份认证方案(转载)

    原文:https://segmentfault.com/a/1190000018535570?utm_source=tag-newest 概述 今天咱们面对移动互联网的发展,系统一般是多个客户端对应一 ...

  4. 漏洞应急响应之批量poc验证

    1.文章难易度 [★★★] 2.文章知识点: python,poc验证; 3.文章作者: 野驴 4.本文参与 i春秋学院原创文章奖励计划,未经许可禁止转载! 0x01前言 当互联网爆出高危漏洞,或者团 ...

  5. 使用 PLSQL 连接 Oracle9i 数据库

    昨天用了Navicate连接Oracle数据库,不停的掉线,然后死机,只能重启Navicate,没办法,还是用回plsql吧,重装了一遍(之前重装系统后,电脑自带的公司原有的软件没啦) 先安装了Ora ...

  6. Django创建和配置文件

    首先我们随便找一个文件 shift+鼠标右键 点击打开 Powershell 窗口 然后输入命令  django-admin startproject 项目名字 输入cd day   进入这个项目下 ...

  7. 干货:教你如何监控 Java 线程池运行状态

    之前写过一篇 Java 线程池的使用介绍文章<线程池全面解析>,全面介绍了什么是线程池.线程池核心类.线程池工作流程.线程池分类.拒绝策略.及如何提交与关闭线程池等. 但在实际开发过程中, ...

  8. iOS开发笔记-根据frame大小动态调整fontSize的自适应文本及圆形进度条控件的实现

    最近同样是新App,设计稿里出现一种圆形进度条的设计,如下: 想了想,圆形进度条实现起来不难,但是其中显示百分比的文本确需要自适应,虽然可以使用时自己设定文本字体的大小,但是这样显得很麻烦,也很low ...

  9. Liferay7 BPM门户开发之24: Liferay7应用程序安全

    整理中...... Resources, Roles, and PermissionsPortal Access Control List (PACL) Custom SSO Providers Au ...

  10. docker 中ulimit设置理解

    背景: 在k8s上跑es集群碰到的问题 OS版本 红旗4.5(基于centos6.8 内核) Docker:1.17.02 现象: 本次出现的问题现象:es pod启动失败,一直报max file d ...