现在许多的主流网站都将'#'大规模用于重要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. Python踩坑之 sys.argv[-1]代表什么

    平台:win10+python 3.7.0 一.sys说明: sys.argv这个函数是我们写python脚本中最常用的一个函数. sys是Python的一个「标准库」,也就是官方出的「模块」,是「S ...

  2. drf4 视图与路由组件

    APIView和View的区别 不管是View还是APIView最开始调用的都是as_view() APIView继承了View, 并且执行了View中的as_view()方法,最后把view返回了, ...

  3. & 引用

    核心: 对引用的操作与对变量直接操作完全一样注意点: 引用并非是地址运算符 编译器一般将引用看作是const指针,即只占用指针大小空间 引用只能在初始化的时候引用一次 ,不能更改为转而引用其他变量.使 ...

  4. Learning Rust - Syntax

    Rust is another compiling language that may replace the position of C/C++ in server filed. It runs f ...

  5. noip第14课资料

  6. Hessian 使用例子

    一.协议包(数据对象需要实现序列化接口,可以用于服务端接口.客户端调用服务之用) /** * */ package com.junge.demo.protocol.model; import java ...

  7. Android 音乐(音效)播放方式总结

    一.音效的分类 音效按照作用的不同,可以将音效分为即时音效和背景音乐.两种音效在Android中的实现技术是不同的. 主要的实现方式为:SoundPool.MediaPlayer. 区别在于,Medi ...

  8. dwr学习(一):简单dwr实例

    博客分类:  dwr   最近写ajax写烦了,想着能不能有个更简单的“ajax”,一问就问到这个dwr了.赶紧去官网学习了下,这里写个博客记录一下实例. 测试环境:tomcat6.0 1.新建一个w ...

  9. web API简介(三):客户端储存之Web Storage API

    概述 前篇:web API简介(二):客户端储存之document.cookie API 客户端储存从某一方面来说和动态网站差不多.动态网站是用服务端来储存数据,而客户端储存是用客户端来储存数据. W ...

  10. 基于vue的颜色选择器vue-color-picker

    项目中有用到颜色选择器的童鞋们可以看过来了 关于color-picker的jquery的插件是有蛮多,不过vue组件没有吧,反正我没有找到, 虽然element-ui里面有这个,但是你愿意为了一个小功 ...