现在许多的主流网站都将'#'大规模用于重要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. Spring遇到的问题合集

    2018-09-15 元素 "tx:annotation-driven" 的前缀 "tx" 未绑定. 后来我加了 http://www.springframew ...

  2. Zookeeper系列3 实现分布式锁

    基本思路 1 client调用create()方法创建“/locks/_lock_”临时顺序节点,注意节点类型是EPHEMERAL_SEQUENTIAL 2 client调用getChildren(& ...

  3. HBase总结(十一)hbase Java API 介绍及使用示例

    几个相关类与HBase数据模型之间的对应关系 java类 HBase数据模型 HBaseAdmin 数据库(DataBase) HBaseConfiguration HTable 表(Table) H ...

  4. Python10/24--组合/封装/property装饰器/多态

    组合的应用: 1. 什么是组合 一个对象的属性是来自于另外一个类的对象,称之为组合 2. 为何用组合 组合也是用来解决类与类代码冗余的问题 3. 如何用组合 '''class Foo: aaa=111 ...

  5. async/await的特殊的地方

    一:async如果是用于方法声明里,那么要求这个方法的返回值必须是Task.Task<TResult>.void这三种,而且await出现的地方要求其所在的方法必须是async修饰的方法: ...

  6. 瞎搞poj1008

    http://poj.org/problem?id=1008 题意: 两种历法: 1.Haab,一年365天,共19个月,前18月有20天(编号为0-19),最后一个月有5天(编号为0-4)pop(1 ...

  7. mysql windows 5.7 安装版下载地址

    https://dev.mysql.com/downloads/windows/installer/5.7.html

  8. Android-Java-构造方法内存图

    描述Dog对象: package android.java.oop07; // 描述Dog对象/实体 public class Dog { private String name; private i ...

  9. EF生成实体自动添加数据库字段注释

    我们在用EF从数据库生成模型的时候,默认实体类是没有注释的,但是我们已经在数据库字段添加说明了,能不能自动把注释也拿过来? 答案是:能. 那么我们开始 首先随便开一个ASP.NET   MVC项目,我 ...

  10. Lerning Entity Framework 6 ------ Working with in-memory data

    Sometimes, you need to find some data in an existing context instead of the database. By befault, En ...