现在许多的主流网站都将'#'大规模用于重要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. leveldb 学习记录(七) SSTable构造

    使用TableBuilder构造一个Table struct TableBuilder::Rep { // TableBuilder内部使用的结构,记录当前的一些状态等 Options options ...

  2. Java多线程系列3 synchronized 关键词

    先来看一个线程安全的例子 ,两个线程对count进行累加,共累加10万次. public class AddTest { public static void main(String[] args) ...

  3. 根据Excel模板存储数据,并下载

    @RequestMapping("/exportList") @ResponseBody public Map<String, Object> exportList(H ...

  4. fortran77读写文本文档

    PROGRAM WRITETEXT IMPLICIT NONE INTEGER,PARAMETER :: NE=!fortran90 语法定义变量 DOUBLE PRECISION A(,),B(,) ...

  5. 4k项目--PHY通道绑定的两种模式

    1.通道绑定有两种模式: • PMA bonding• PMA and PCS bonding GT通道是不支持通道绑定的 2.PMA绑定 PMA绑定减少了PMA之间的通道之间的Skew.并且在PMA ...

  6. (转载)RHEL7(RedHat 7)本地源的配置

    配置yum源 1.首先连接RedHat7的DVD再把挂载DVD光盘到/mnt   因为配置时候路径名里面不能有空格,否则不能识别  [root@ mnt]# mount /dev/cdrom /mnt ...

  7. 提高Linux运维效率的命令行常用快捷键

    提高Linux运维效率的命令行常用快捷键 tab 命令或路径等的补全键,Linux最有用快捷键 Ctrl+a 光标回到命令行首 Ctrl+e 光标回到命令行尾 Ctrl+k 剪切(删除)光标处到行尾的 ...

  8. ubuntu16.04安装最新版docker、docker-compose、docker-machine

    安装前说明: 本文将介绍在ubuntu16.04系统下安装和升级docker.docker-compose.docker-machine. docker:有两个版本:docker-ce(社区版)和do ...

  9. Rgb2Gray

    GPU上运行的函数又称为Kernel,用__global__修饰 调用Kernel函数时,用FunctionCall<<<block_shape, thread_shape, int ...

  10. Java学习笔记44(多线程一:Thread类)

    多线程的概念:略 多线程的目的:提高效率 主线程: package demo; //主线程 public class Demo { public static void main(String[] a ...