您的当前位置:首页js获取或设置当前窗口url参数的小例子_javascript技巧
广告

js获取或设置当前窗口url参数的小例子_javascript技巧

2023-12-04 来源:旭新科技网

代码如下:// 获取当前窗口url中param参数的值function get_param(param){ var query = location.search.substring(1).split('&'); for(var i=0;i

// 设置当前窗口url中param的值function set_param(param,value){ var query = location.search.substring(1); var p = new RegExp("(^|&"+param+")=[^&]*"); if(p.test(query)){ query = query.replace(p,"$1="+value); location.search = '?'+query; }else{ if(query == ''){ location.search = '?'+param+'='+value; }else{ location.search = '?'+query+'&'+param+'='+value; } } }注意location.search获取到的是url中?开始到#之间的内容(包含?但不包含#)。

在上一个翻页代码,其中用有到了上面两个函数

代码如下:// 上一页function page_pre(current_page,page_total){ if(current_page <= 1 || current_page > page_total){ return false; } var pre_page = parseInt(current_page) - 1; set_param('page',pre_page);}

// 下一页function page_next(current_page,page_total){ if(current_page < 1 || current_page >= page_total){ return false; } var next_page = parseInt(current_page) + 1; set_param('page',next_page);}

小编还为您整理了以下内容,可能对您也有帮助:

如何使用js获取修改URL

使用js对当前的URL进行操作,可以使用内置对象window.location;

window.location有以下属性:

window.location.href:取得当前地址栏中的完整URL,可以通过赋值改变当前地址栏中的URL;

window.location.search 取得当前URL的参数部分,即“?”后面的部分(包括问号),可以通过赋值改变URL的参数部分;

window.location.hash:取得当前URL中包含的锚记,即“#”后面的部分(包括#),可以通过赋值改变URL的锚记部分;

window.location.host:取得当前URL中的主机信息,包括端口号,可以通过赋值改变主机信息;

window.location.hostname:取得当前URL中的域名部分,不包括端口号,可以通过赋值改变域名;

window.location.port:取得当前URL中的端口号,可以通过赋值改变端口号;

window.location.pathname:取得当前URL中的路径信息,即域名与参数之间的部分,可以通过赋值改变当前URL的路径;

window.location.protocol:取得当前URL的协议部分,比如http:,https:等,可以通过赋值改变URL的协议部分;

window.location有一下方法:

window.location.replace(url):用传入的URL字符串替代当前的URL,该方法会将历史记录中的URL一并替换掉,也就是说,这个方法会覆盖之前的历史记录;

window.location.reload():重新加载当前URL,相当于刷新;

window.location.assign(url):加载传入的URL,该方法不会覆盖之前的历史记录;

JS获取地址栏url参数

本章内容分为三部分:

开始之前先简单了解一下

如:url地址: http://xxxxx:9010/test.html?leaf&le=2
window.location.search获取到的就是 ?leaf&le=2 ;
window.location.search.substr(1)获取到的就是 leaf&le=2 ;

一、JS获取地址栏url参数:

如果你想获取地址栏的其他参数,只需要执行 var 参数=getUrlParam('参数') ;
比如获取参数a,执行 var a=getUrlParam('a') 就可以啦。简单又实用。

二、解决请求接口乱码问题
但是在我请求接口数据的时候,页面获取到是类似???这种乱码。

然后我是这样解决的:
1、发送方decodeURI编码:

2、接收方encodeURI解码
根据后台接口拼接url中使用encodeURI:

三、关于根据后台接口拼接url

整理笔记,不断优化更新。如果有错误或可以优化的地方欢迎指出,互相学习,共同进步。
如果对你有用就点个小心心吧❤

JS获取地址栏url参数

本章内容分为三部分:

开始之前先简单了解一下

如:url地址: http://xxxxx:9010/test.html?leaf&le=2
window.location.search获取到的就是 ?leaf&le=2 ;
window.location.search.substr(1)获取到的就是 leaf&le=2 ;

一、JS获取地址栏url参数:

如果你想获取地址栏的其他参数,只需要执行 var 参数=getUrlParam('参数') ;
比如获取参数a,执行 var a=getUrlParam('a') 就可以啦。简单又实用。

二、解决请求接口乱码问题
但是在我请求接口数据的时候,页面获取到是类似???这种乱码。

然后我是这样解决的:
1、发送方decodeURI编码:

2、接收方encodeURI解码
根据后台接口拼接url中使用encodeURI:

三、关于根据后台接口拼接url

整理笔记,不断优化更新。如果有错误或可以优化的地方欢迎指出,互相学习,共同进步。
如果对你有用就点个小心心吧❤

js取得url地址参数实例

复制代码
代码如下:
<script
language="javascript">
/**
*
获取url地址中的参数
*
link:www.jb51.net
*/
var
url="www.jb51.net/af.php?id=50&a=100";
alert(url);
if(url.indexOf("?")!=-1){
var
p=url.indexOf("?");
//返回所在位置
var
str
=
url.substr(p+1)
//从这个位置开始截取
strs
=
str.split("&");
//拆分
alert(strs);
for(var
i=0;i<strs.length;i++){
document.write([strs[i].split("=")[0]],'=',unescape(strs[i].split("=")[1]),'<br>');
}
}else{
alert("没有参数");
}
//
date:2013/2/22
</script>

js取得url地址参数实例

复制代码
代码如下:
<script
language="javascript">
/**
*
获取url地址中的参数
*
link:www.jb51.net
*/
var
url="www.jb51.net/af.php?id=50&a=100";
alert(url);
if(url.indexOf("?")!=-1){
var
p=url.indexOf("?");
//返回所在位置
var
str
=
url.substr(p+1)
//从这个位置开始截取
strs
=
str.split("&");
//拆分
alert(strs);
for(var
i=0;i<strs.length;i++){
document.write([strs[i].split("=")[0]],'=',unescape(strs[i].split("=")[1]),'<br>');
}
}else{
alert("没有参数");
}
//
date:2013/2/22
</script>

js使用正则获取当前页面url指定参数

网址: http://1.com/
调用: QueryString('name')
返回: null

网址: http://1.com/?name=cwj&age=21
调用: QueryString('name')
返回: cwj

现在随便拿一个网址: https://m.weibo.cn/u/5902368392?topnav=1&wvr=6&is_all=1&jumpfrom=weibocom ,这个网址的 location 是:

所以这个地址的 location.search 是 ?topnav=1&wvr=6&is_all=1&jumpfrom=weibocom ,这就是需要执行匹配的字符串

match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。

存放匹配结果的数组。在这个方法中将匹配结果放在了数组 sValue 中。

RegExp 对象表示正则表达式

该对象接受两个参数,第一个参数是一个字符串,指定了正则表达式的模式或其他正则表达式。第二个参数 i 代表着区分大小写的匹配。

调用该方法: QueryString('wvr') ,根据以上正则表达式匹配出来的结果是:

要注意的是 match 方法返回的数组 0 位置是匹配的字符串,所以相应参数在 sValue[1] 中

js使用正则获取当前页面url指定参数

网址: http://1.com/
调用: QueryString('name')
返回: null

网址: http://1.com/?name=cwj&age=21
调用: QueryString('name')
返回: cwj

现在随便拿一个网址: https://m.weibo.cn/u/5902368392?topnav=1&wvr=6&is_all=1&jumpfrom=weibocom ,这个网址的 location 是:

所以这个地址的 location.search 是 ?topnav=1&wvr=6&is_all=1&jumpfrom=weibocom ,这就是需要执行匹配的字符串

match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。

存放匹配结果的数组。在这个方法中将匹配结果放在了数组 sValue 中。

RegExp 对象表示正则表达式

该对象接受两个参数,第一个参数是一个字符串,指定了正则表达式的模式或其他正则表达式。第二个参数 i 代表着区分大小写的匹配。

调用该方法: QueryString('wvr') ,根据以上正则表达式匹配出来的结果是:

要注意的是 match 方法返回的数组 0 位置是匹配的字符串,所以相应参数在 sValue[1] 中

用javascript获取地址栏参数


本文列举了用javascript获取地址栏参数的三种方法:
方法一:
script type="text/javascript"
!--
String.prototype.getQuery = function(name) {
var reg = new RegExp("(^|)"+ name +"=([^]*)(|$)");
var r = this.substr(this.indexOf("?")+1).match(reg);
if (r!=null) return unescape(r[2]); return null;
}
var strHref = "amp;b=bbbc=ccc";
alert(strHref.getQuery("a"));
alert(strHref.getQuery("b"));
alert(strHref.getQuery("c"));
//--
/script
方法二:
script type="text/javascript"
function getUrlPara(paraName){
var sUrl = location.href;
var sReg = "(?:?|){1}"+paraName+"=([^]*)"
var re=new RegExp(sReg,"gi");
re.exec(sUrl);
return RegExp.$1;
}
//应用实例:test_para.html?a=11b=22c=33
alert(getUrlPara("a"));
alert(getUrlPara("b"));
/script
方法三:
script type="text/javascript"
!--
function Request(strName){
var strHref = "amp;b=bbbc=ccc";
var intPos = strHref.indexOf("?");
var strRight = strHref.substr(intPos + 1);
var arrTmp = strRight.split("");
for(var i = 0; i
arrTmp.length; i++) {
var arrTemp = arrTmp[i].split("=");
if(arrTemp[0].toUpperCase() == strName.toUpperCase()) return arrTemp[1];
}
return "";
}
alert(Request("a"));
alert(Request("b"));
alert(Request("c"));
//--
/script

用javascript获取地址栏参数


本文列举了用javascript获取地址栏参数的三种方法:
方法一:
script type="text/javascript"
!--
String.prototype.getQuery = function(name) {
var reg = new RegExp("(^|)"+ name +"=([^]*)(|$)");
var r = this.substr(this.indexOf("?")+1).match(reg);
if (r!=null) return unescape(r[2]); return null;
}
var strHref = "amp;b=bbbc=ccc";
alert(strHref.getQuery("a"));
alert(strHref.getQuery("b"));
alert(strHref.getQuery("c"));
//--
/script
方法二:
script type="text/javascript"
function getUrlPara(paraName){
var sUrl = location.href;
var sReg = "(?:?|){1}"+paraName+"=([^]*)"
var re=new RegExp(sReg,"gi");
re.exec(sUrl);
return RegExp.$1;
}
//应用实例:test_para.html?a=11b=22c=33
alert(getUrlPara("a"));
alert(getUrlPara("b"));
/script
方法三:
script type="text/javascript"
!--
function Request(strName){
var strHref = "amp;b=bbbc=ccc";
var intPos = strHref.indexOf("?");
var strRight = strHref.substr(intPos + 1);
var arrTmp = strRight.split("");
for(var i = 0; i
arrTmp.length; i++) {
var arrTemp = arrTmp[i].split("=");
if(arrTemp[0].toUpperCase() == strName.toUpperCase()) return arrTemp[1];
}
return "";
}
alert(Request("a"));
alert(Request("b"));
alert(Request("c"));
//--
/script

javascript中怎么获取请求的参数?

通过使用window.location.search可以获取到当前URL的?号开始的字符串,如前面的链接获取到的search为?id=001,再对获取的字符串进行处理,就可以获取到参数的值了,参考代码如下:
  <SPAN style="FONT-SIZE: 14px">function getUrlParam(name) {
  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  var r = window.location.search.substr(1).match(reg);
  if (r != null)
  return unescape(r[2]);
  return null;
  }
  </SPAN>
  在调用上面的方法的时候,只要传入参数的名称,就可以获取到想要的参数的值了,如:getUrlParam("id")。

javascript中怎么获取请求的参数?

通过使用window.location.search可以获取到当前URL的?号开始的字符串,如前面的链接获取到的search为?id=001,再对获取的字符串进行处理,就可以获取到参数的值了,参考代码如下:
  <SPAN style="FONT-SIZE: 14px">function getUrlParam(name) {
  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  var r = window.location.search.substr(1).match(reg);
  if (r != null)
  return unescape(r[2]);
  return null;
  }
  </SPAN>
  在调用上面的方法的时候,只要传入参数的名称,就可以获取到想要的参数的值了,如:getUrlParam("id")。

如何用js获取当前url的参数值

给你个例子,自己对照看看。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns=" http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>javascript获取URL参数和参数值</title>

<script type="text/javascript">

<!--

var url = " http://www.baidu.com/?age=25&k=1&site=asp&abc=123;"//javascript获取指定参数及其对应的值

function getParameter(paraStr, url)

{

var result = "";

//获取URL中全部参数列表数据

var str = "&" + url.split("?")[1];

var paraName = paraStr + "=";

//判断要获取的参数是否存在

if(str.indexOf("&"+paraName)!=-1)

{

//如果要获取的参数到结尾是否还包含“&”

if(str.substring(str.indexOf(paraName),str.length).indexOf("&")!=-1)

{

//得到要获取的参数到结尾的字符串

var TmpStr=str.substring(str.indexOf(paraName),str.length);

//截取从参数开始到最近的“&”出现位置间的字符

result=TmpStr.substr(TmpStr.indexOf(paraName),TmpStr.indexOf("&")-TmpStr.indexOf(paraName));

}

else

{

result=str.substring(str.indexOf(paraName),str.length);

}

}

else

{

result="无此参数";

}

return (result.replace("&",""));

}//调用方法:var 变量名 = getParameter("要获取的参数名", URL地址)

var r = getParameter("age",url);//测试输出,结果是:site=popasp

alert(r);

//根据得到的结果可以使用

var pName = r.split("=")[0]; //获取参数名

var pValue = r.split("=")[1]; //获取参数值//测试输出:

alert("参数名:" + pName + "\n\n" + "参数值:" + pValue);//其他实际应用:

//可以根据需要,配合以下方法实现自己要实现的功能;

//var hostname = location.hostname; //获取当前域名(不包含http://)

//var localurl = location.href; //获取当前完整的URL地址信息(包含http://,域名,路径,具体文件和全部传递参数)

//var referurl = document.referrer; //获取上一页完整的URL信息(包含http://,域名,路径,具体文件和全部传递参数)//-->

</script>

</head><body>

</body>

</html>

js获取url中指定参数的值(兼容hash)

示例:
*URL: https://www.baidu.com/?name=21002492_21_hao_pg

window.location和document.location互相等价的,可以交换使用

location的8个属性都是可读写的,但是只有href与hash的写才有意义。例如改变location.href会重新定位到一个URL,而修改location.hash会跳到当前页面中的anchor(<a id="name">或者<div id="id">等)名字的标记(如果有),而且页面不会被重新加载

注意
URL: https://www.baidu.com/?name=21002492_21_hao_pg#test?test1=1

search:"?name=21002492_21_hao_pg" 第一个"?"之后

hash:"#test?test1=1" 第一个"#"之后的内容

注意上面的search和hash的区别,如果URL中“?”之前有一个“#”比如:“ https://www.baidu.com/#/test?name=21002492_21_hao_pg ”那么使用window.location.search得到的就是空(“”)。因为“?name=21002492_21_hao_pg”串字符是属于“#/test?name=21002492_21_hao_pg”这个串字符的,也就是说查询字符串search只能在取到“?”后面和“#”之前的内容,如果“#”之前没有“?”search取值为空。

现在前端会使用大量的框架来搭建前端页面应用,比如vue,当开启hash模式的时候,在实例外部方法无法使用this.$route时,老方法window.location.search也获取不到,这时需要使用window.location.hash来获取参数

兼容hash模式与非hash模式的方法:

js获取url中指定参数的值(兼容hash)

示例:
*URL: https://www.baidu.com/?name=21002492_21_hao_pg

window.location和document.location互相等价的,可以交换使用

location的8个属性都是可读写的,但是只有href与hash的写才有意义。例如改变location.href会重新定位到一个URL,而修改location.hash会跳到当前页面中的anchor(<a id="name">或者<div id="id">等)名字的标记(如果有),而且页面不会被重新加载

注意
URL: https://www.baidu.com/?name=21002492_21_hao_pg#test?test1=1

search:"?name=21002492_21_hao_pg" 第一个"?"之后

hash:"#test?test1=1" 第一个"#"之后的内容

注意上面的search和hash的区别,如果URL中“?”之前有一个“#”比如:“ https://www.baidu.com/#/test?name=21002492_21_hao_pg ”那么使用window.location.search得到的就是空(“”)。因为“?name=21002492_21_hao_pg”串字符是属于“#/test?name=21002492_21_hao_pg”这个串字符的,也就是说查询字符串search只能在取到“?”后面和“#”之前的内容,如果“#”之前没有“?”search取值为空。

现在前端会使用大量的框架来搭建前端页面应用,比如vue,当开启hash模式的时候,在实例外部方法无法使用this.$route时,老方法window.location.search也获取不到,这时需要使用window.location.hash来获取参数

兼容hash模式与非hash模式的方法:

js获取url参数值

以下函数可以获取url任意参数的值:

function getParams(key){
    var url = location.search.replace(/^?/,'').split('&');
    var paramsObj = {};
    for(var i = 0, iLen = url.length; i < iLen; i++){
        var param = url[i].split('=');
        paramsObj[param[0]] = param[1];
    }
    if(key){
        return paramsObj[key] || '';
    }
    return paramsObj;
}

可选参数key表示获取参数的名称,如果省略该参数,则会返回一个对象,包含所有参数的key和value。

js获取url参数值

以下函数可以获取url任意参数的值:

function getParams(key){
    var url = location.search.replace(/^?/,'').split('&');
    var paramsObj = {};
    for(var i = 0, iLen = url.length; i < iLen; i++){
        var param = url[i].split('=');
        paramsObj[param[0]] = param[1];
    }
    if(key){
        return paramsObj[key] || '';
    }
    return paramsObj;
}

可选参数key表示获取参数的名称,如果省略该参数,则会返回一个对象,包含所有参数的key和value。

如何用js获取当前url的参数值

不太明白用JS获取参数的目的,也许Ajax中能用到吧

<script language = javascript>

function request(paras){

var url = location.href;

var paraString = url.substring(url.indexOf("?")+1,url.length).split("&");

var paraObj = {}

for (i=0; j=paraString[i]; i++){

paraObj[j.substring(0,j.indexOf("=")).toLowerCase()] = j.substring(j.indexOf("=")+1,j.length);

}

var returnValue = paraObj[paras.toLowerCase()];

if(typeof(returnValue)=="undefined"){

return "";

}else{

return returnValue;

}

}

//如你给出的地址可以这样

var classid = request("classid");

var id = request("id");

//然后你就可以对这些参数处理了

</script>

旭新科技网还为您提供以下相关内容希望对您有帮助:

js获取url参数

1. 使用URLSearchParams对象:`URLSearchParams`是一个内置的JavaScript对象,它提供了一种方便的方式来处理URL的查询参数。可以通过以下步骤使用它来获取URL参数:创建一个新的`URLSearchParams`对象,并传入URL的查询字符串。使用`get`方法获取特定参数的值。如果参数存在,该方法将返回该参数的值;否则,...

前端使用js如何准确获取当前页面url网址信息

// 参数1 = Request['参数1'];// 参数2 = Request['参数2'];// 参数3 = Request['参数3'];// 参数N = Request['参数N'];三、指定取 比如说一个url:http://i.cnblogs.com/?j=js,我们想得到参数j的值,可以通过以下函数调用。function GetQueryString(name) {   var reg = ...

利用js拿到当前页面的url,并将地址赋值给某变量

urlObj.url//获得URL(直接用url也可以)urlObj.queryString.abc//获得URL中?b=1&amp;abc=2中的2

js取得url地址参数实例

language="javascript"&gt; / 获取url地址中的参数 link:www.jb51.net / var url="www.jb51.net/af.php?id=50&amp;a=100";alert(url);if(url.indexOf("?")!=-1){ var p=url.indexOf("?");//返回所在位置 var str = url.substr(p+1)//从这个位置开始截取 strs = str.split("&amp;");...

如何用js获取当前url的参数值

alert("参数名:" + pName + "\n\n" + "参数值:" + pValue);//其他实际应用://可以根据需要,配合以下方法实现自己要实现的功能;//var hostname = location.hostname; //获取当前域名(不包含http://)//var localurl = location.href; //获取当前完整的URL地址信息(包含http://,...

js跳转到指定url

不知道的小伙伴来看看小编今天的分享吧!js怎么跳转到指定url方法如下:1、οnclick=javascript:window.location.href=URL 2、οnclick=location=URL 3、οnclick=window.location.href=URL?id=11 如果页面中有frame可以将在location前面添加top.mainframe.frames[right_frame].location ...

如何用js获取当前url的参数值

不太明白用JS获取参数的目的,也许Ajax中能用到吧 function request(paras){ var url = location.href;var paraString = url.substring(url.indexOf("?")+1,url.length).split("&amp;");var paraObj = {} for (i=0; j=paraString[i]; i++){ paraObj[j.substring(0,j.indexOf("=")...

js获取url地址里的数据

1.采用正则表达式获取地址栏参数:代码如下:function GetQueryString(name){ var reg = new RegExp("(^|&amp;)"+ name +"=([^&amp;]*)(&amp;|$)");var r = window.location.search.substr(1).match(reg);if(r!=null)return unescape(r[2]); return null;} // 调用方法 alert(GetQueryString("...

js获取子窗口url

// 获取当前窗口url中param参数的值 function get_param(param){ var query = location.search.substring(1).split('&amp;');for(var i=0;i var kv = query[i].split('=');、、定义kv if(kv[0] == param){ return kv[1]; //返回 } } return null;} // 设置当前窗口url中param的值...

js获取url 中的值,并跳转相应页面

一:获取URL带QUESTRING参数的JAVASCRIPT客户端解决方案,相当于asp的request.querystring,PHP的$_GET 1.函数:&lt;Script language="javascript"&gt; function GetRequest() { var url = location.search; //获取url中"?"符后的字串 var theRequest = new Object();if (url.indexOf("?") != -1) {...

Top