使用js获取当前页面地址栏参数的两种方法



/*
    window.location是一个对象,包含属性有:
    hash 从井号 (#) 开始的 URL(锚)
    host 主机名和当前 URL 的端口号
    hostname 当前 URL 的主机名
    href 完整的 URL
    pathname 当前 URL 的路径部分
    port 当前 URL 的端口号
    protocol 当前 URL 的协议
    search 从问号 (?) 开始的 URL(查询部分)
*/

//获取window.location.href是最常用的

//方法一、采用正则表达式获取地址栏指定参数
    function GetQuery(name)
    {
         var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
         var r = window.location.search.substr(1).match(reg);
         if(r!=null)return  unescape(r[2]); return null;
    }
    //假如我当前页面的地址为:http://localhost/d3js/analyze.html?firstProp=sepal_length&secondProp=sepal_width
    //测试用例
    console.log(GetQuery("firstProp")); //结果:sepal_length
    console.log(GetQuery("secondProp"));//结果:sepal_width

    //看一下window.location.search和window.location.href的区别:
    console.log(window.location.search); //输出?号以后的:?firstProp=sepal_length&secondProp=sepal_width

    console.log(window.location.href);//输出整个url:http://localhost/d3js/analyze.html?firstProp=sepal_length&secondProp=sepal_width
//方法二、单个参数的获取方法
    function GetRequest(url) {
        var props = [];
        if (url.indexOf("?") != -1) {    //判断是否有参数
            var parameters = url.split("?")[1]; 
            var parametersArr = parameters.split("&");
            for(var i = 0; i < parametersArr.length; i++) {
                props.push(parametersArr[i].split("="));
            }
        }
        return props;
    }

    var url = location.href; //获取当前完整的url
    var firstProp, secondProp;//等会放url参数的变量
    var request=GetRequest(url);//结果是一个包含所有参数对的二维数组
    //如果你没有传参数的话,我们要加一个判断 
    if(request != null && request.length === 2) {
        firstProp = request[0][1];
        secondProp = request[1][1];
    }
    console.log(firstProp+","+secondProp); //输出:sepal_length,sepal_width

你可能感兴趣的:(javascript)