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

Posted 2023-03-18

http://127.0.0.1/e/action/ShowInfo.php?classid=9&id=2
如何用js获取以上url中classid和id的值？

不太明白用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> 参考技术A 用js代码在本地分析得到classid和id的值总归是比较麻烦，而作为GET参数，在服务端总是要用到的。
如果你的本地js将用到这两个参数值，你可以直接让服务端将这两个值写入到本地。
<?php
$mystr="<script>x_classid=9;x_id=2</script>"
echo $mystr
?>
这样你在本地就可以直接调用x_classid和x_id以得到这两个参数。 参考技术B var url = "http://127.0.0.1/e/action/ShowInfo.php?classid=9&id=2";
function parse_url(_url)
var pattern = /(\w+)=(\w+)/ig;
var parames = ;
url.replace(pattern, function(a, b, c)
parames[b] = c;
);
return parames;


var parames = parse_url(url);
alert(parames['classid'] + ", " + parames['id']);

//结果 9, 2 参考技术C <script>
function Request(strName)
var strHref = document.location.href;
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 0;


alert("classid值:"+Request("classid")+"id值"+Request("id"))
</script>

如何用js获取浏览器URL中查询字符串的参数

 

 

首先要知道Location这个对象以及这个对象中的一些属性：

href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/

host:设置或返回主机名和当前的URL的端口号。本博客首页返回www.cnblogs.com

hostname:设置或返回当前URL的主机名。本博客首页返回www.cnblogs.com

hash:设置或返回从井号（#）开始的URL（锚）。本博客首页返回 空

pathname:设置或返回当前URL的路径部分。本博客首页返回/wymninja/

port:设置或返回当前URL的端口号。本博客首页返回 空

protocol:设置或返回当前URL的协议。本博客首页返回 http:

search:设置或返回从问号 (?) 开始的 URL（查询部分）

location对象属性图示:图片来自慕课网

location的href属性存放的是文档的完整 URL，其他属性则分别描述了 URL 的各个部分。这些属性与 Anchor 对象（或 Area 对象）的 URL 属性非常相似。当一个 Location 对象被转换成字符串，href 属性的值被返回。这意味着你可以使用表达式 location 来替代 location.href。不过 Anchor 对象表示的是文档中的超链接，Location 对象表示的却是浏览器当前显示的文档的 URL（或位置）

var s = location.toString();
console.log(s);
#result
//http://www.cnblogs.com/wymninja/

 

Location对象的这些属性都是可读可写的，如果改变了文档的location.href，则浏览器会载入新的页面。同样如果改变了location.hash，则页面会跳转到新的锚点，但此时页面不会重载。

Location对象还有三个方法：assign()、reload()、replace()

assign():加载新的文档

reload():可以重新装载当前文档

replace():可以装载一个新文档而无须为它创建一个新的历史记录。也就是说，在浏览器的历史列表中，新文档将替换当前文档。这样就不能通过【返回】按钮返回当前文档了。

注意：

不要混淆Window对象的location属性和Document对象的location对象。前者引用一个Location对象，后者只是一个 只读字符串，并不具有Location对象的任何特性。Document.location与document.URL是同义的。但是，当存在服务器重定 向时，document.location包含的是已经装载的URL,而location.href包含的则是原始请求的文档的URL。

所以要获取浏览器URL中查询字符串的参数。也就是location.search部分。以慕课网图片为例就是?courseid = 8&cahpterid = 86中的8和86！！！！然后就利用如下代码：

function getQuery(name){
　 var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);//从?之后开始匹配如getQuery(courseid)返回一个数组["courseid=8","","8","&",index:0,input:"courseid=8"]
   if (r!=null) return unescape(r[2]); return null;
}

其中:

对match不清楚可查阅我的博客Javascript string对象

unescape 对参数进行解码，如空格解码为20%。