地址栏连接参数修改

Posted 王希桐

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了地址栏连接参数修改相关的知识,希望对你有一定的参考价值。

分享两个处理地址栏参数的常见方法

第一步:将参数连接转换为对象

 

// 将连接参数转为对象
function queryToJson(url) {
    let locse = url.split(‘?‘);
    let search = locse[1] ? locse[1] : locse[0];
    let pairs = search.split(‘&‘);
    let result = {};
    pairs.forEach(function (pair) {
        pair = pair.split(‘=‘);
        if (pair[0].length > 0) {
            let resultPair = ‘‘;
            try {
                resultPair = decodeURIComponent(pair[1]) || ‘‘;
            }
            catch (e) { }
            result[pair[0]] = resultPair;
        }
    });
    return result;
}

 

 

 

第二步:修改连接参数

// 修改连接参数
function changeURLArg(url, arg, argVal) {
    let pattern = arg + ‘=([^&]*)‘;
    let replaceText = arg + ‘=‘ + argVal;
    if (url.match(pattern)) {
        let tmp = ‘/(‘ + arg + ‘=)([^&]*)/gi‘;
        tmp = url.replace(eval(tmp), replaceText);
        return tmp;
    }
    else {
        if (url.match(‘[\?]‘)) {
            return url + ‘&‘ + replaceText;
        }
        else {
            return url + ‘?‘ + replaceText;
        }
    }
}

参数解释

url:就是连接的地址,可以是你手动传,也可以是localtion.href获取当前地址

arg:想要修改的参数名称

argVal:想要把被修改的参数转化成什么

 

使用示例

 

let URL = location.href;
        let bbb;
        //把URL变成对象
        let url = this.queryToJson(URL);
        // 把url的bbb前加aaa
        if (!!url.bbb) {
            //如果地址栏有bbb参数的时候
            if (url.bbb.indexOf(‘aaa‘) - 0 > -1) {
                //地址栏bbb参数的值前面有aaa的时候
                bbb = url.bbb;
            }
            else {
                //地址栏bbb参数的值不是aaa的时候,在前面加上aaa
                bbb = ‘aaa‘ + url.bbb;
            }
        }
        else {
            //如果地址栏没有bbb参数的时候
            bbb = ‘ccc‘;
        }
        //修改连接参数
        let useurl = this.changeURLArg(URL, ‘bbb‘, bbb);

 

以上是关于地址栏连接参数修改的主要内容,如果未能解决你的问题,请参考以下文章

JS替换地址栏参数值

JS获取URL的参数

在地址栏获取参数

操作栏选项卡:使用多次实例化的单个片段时如何传递参数

利用JS获取地址栏的中文参数,如何避免取到乱码?

无刷新页面修改地址栏