静态网站如何获取Get参数,通过js获取url的参数数据的实现方式

时间: 2017-10-26阅读: 1701标签: url

不使用动态语言php,java等,直接通过js获取链接中传递的get数据的方法总结。下面给大家说一下用JavaScript在静态页面上接受Get参数的方法,其实很简单 只要用户打开的页面url后带有参数。而JavaScript可以获取当前页面的url 只要对获取下来的url进行简单地解析即可。


方法一、正则表达式

推荐使用,方便快捷的一种方式,代码如下:

;(function(w) {
	var Plugin ={//默认为match
		getUrlParam:function(name) {//获取url中的参数
			var reg = new RegExp('(^|&?)' + name + '=([^&]*)(&|$)', 'i');
		    var r = window.location.href.substr(1).match(reg);
		    if (r != null) {
		        return unescape(r[2]);//如果参数有中文使用decodeURl解码返回
		    }
		    return undefined;
		},
	};
	w.G=Plugin;
})(window);

使用:console.log(G.getUrlParam('name')),就可获取参数name的值

注意:unescape()的方式返回,在获取中文参数的时候,获取到的值是乱码的,解决方法:将解码方式unscape换为decodeURI。出现的原因:原因:浏览器会将url中的中文参数进行encodeURI编码,所以要通过js使用decodeURI进行解码


方法二、传统数组方式

通过返回数组的形式获取,代码如下

function get(){
	let u=window.location.href //获取当前页面的url
	let len=u.length //获取url的长度
	let offset=u.indexOf("?") //设置参数字符串开始的位置
	let info=u.substr(offset,len) //取出参数字符串 这里会获得类似“id=1”这样的字符串
	return info.split("=") //对获得的参数字符串按照“=”进行分割
}

使用:var g=get();g[0]获取Get的第一个参数


方法三

function GetRequest() {
   var url = location.search; //获取url中"?"符后的字串
   var theRequest = new Object();
   if (url.indexOf("?") != -1) {
      var str = url.substr(1);
      strs = str.split("&");
      for(var i = 0; i < strs.length; i ++) {
         theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
      }
   }
   return theRequest;
}

使用:GetRequest()['name']

站长推荐

1.阿里云: 本站目前使用的是阿里云主机,安全/可靠/稳定。点击领取2000元代金券、了解最新阿里云产品的各种优惠活动点击进入

2.腾讯云: 提供云服务器、云数据库、云存储、视频与CDN、域名等服务。腾讯云各类产品的最新活动,优惠券领取点击进入

3.广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/13

this.$router.push相同地址报错的解决办法

不能push相同的地址,否则会出 Uncaught (in promise) NavigationDuplicated vue-router.esm.js?fe87:2089 的报错。 解决办法:在main.js下添加以下代码

怎样获取当前网页的URL?

document.documentURI,document.URL两个属性的作用是完全一样的. 都是返回一个当前网页URL的字符串; document.documentURI 继承自Document接口, 适用于所有文档;

Nginx下的PHP框架路由实现

所有的框架处理业务请求时,都会处理URL的路径部分,分配到指定的代码中去处理。实现这一功能的关键就是获取$_SERVER全局变量中对于URL部分的数据,当请求的路径为

网页外链用了 target=_blank,结果悲剧了

今天给大家分享一个 Web 知识点。如果你有过一段时间的 Web 开发经验,可能已经知道了。不过对于刚接触的新手来说,还是有必要了解一下的。我们知道,网页里的a标签默认在当前窗口跳转链接地址

URL和URI的区别

URL的格式由下列三部分组成:协议(或称为服务方式);存有该资源的主机IP地址(有时也包括端口号);主机资源的具体地址,如目录和文件名等。URI,统一资源标识符:主机名。存放资源的自身的名称,由路径表示

js中window.URL对象的使用方式

URL.createObjectURL(object)是URL对象的静态方法,其实就是返回了一个在内存中指向传入参数object的引用路径url字符串。生成的这个url字符串会在当前页面的document被销毁的时候失效。

一个完整URL的组成

用来传输客户端和服务器端交互的信息的(类似于快递小哥),HTTP(顺丰):超文本传输协议(除了传递普通的文本,还可以传递文件流或者进制编码等信息),是目前最常用的WEB传输协议

html中绝对路径和相对路径的区别?比较相对路径和绝对路径的优缺点

相对路径就是相对于当前文件的路径;可以防止被抄袭,如果网页位置改变,里面的链接还是指向正确的URL。在编码编写时不方便使用绝对路径,因为链接应该指向真正的域名,而不是开发站点。

HTML5实现无刷新修改URL

今天在做一个vue的搜索功能,需要从搜索结果页面跳转到细节页面,然后点击返回还能返回到刚刚的结果页面,如果只用window.history.go(-1)当然会重新刷新搜索页面,当然是不行的。我尝试了俩种方式来修改url:

Url的Base64编码以及解码

Base64可以将二进制转码成可见字符方便进行http传输,但是base64转码时会生成“+”,“/”,“=”这些被URL进行转码的特殊字符,导致两方面数据不一致。

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!

文章投稿关于web前端网站点搜索站长推荐网站地图站长QQ:522607023

小程序专栏: 土味情话心理测试脑筋急转弯幽默笑话段子句子语录成语大全运营推广