问号传参解析（queryURLParam）（持续更新）

最新推荐文章于 2024-07-10 10:51:41 发布

tianye00011

最新推荐文章于 2024-07-10 10:51:41 发布

阅读量647

点赞数

分类专栏： JavaScript基础文章标签： js javascript

本文链接：https://blog.csdn.net/tianye00011/article/details/108119694

版权

JavaScript基础专栏收录该内容

18 篇文章 0 订阅

订阅专栏

Solution 2

function queryURLParams(url) {
    // 1.获取 ？和 # 之后的文本
    let askIdx = url.indexOf('?'),
        wellIdx = url.indexOf('#'),
        askText = '',
        wellText = '';
    wellIdx === -1 ? wellIdx = url.length : null;
    wellText = url.substring(wellIdx + 1);
    if (askIdx > -1 ) {
        askText = url.substring(askIdx + 1, wellIdx)
    }
    // 2.获取的文本进行解析。拼成一个对象返回
    let obj = {};
    wellText.length > 0 ? obj['HASH'] = wellText : null;
    if (askText) {
        askText.split('&').forEach(item => {
            let arr = item.split('='),
                key = arr[0],
                val = arr[1];
            obj[key] = val;
        })
    }
    return obj;
}

Solution 2

function queryURLParams(url) {
    // 创建a标签（A元素）来获取问号参数和哈希值
    let link = document.createElement('a');
    link.href = url; // 面向对象
    let askText = link.search.substr(1), // 拿到的是‘?xxxx’
        wellText = link.hash.substr(1), //拿到的是‘#xxxx’
        obj = {};
    // 向对象中进行存储
    wellText ? obj['HASH'] = wellText : null;
    if (askText) {
        let arr = askText.split(/(?:&|=)/g);
        for (let i = 0; i < arr.length; i += 2) {
            obj[arr[i]] = arr[i + 1];
        }
    }
    return obj;
}

Solution 3(正则)

测试用例

// case 1: ? #
let result = queryURLParams('https://sports.qq.com/kbsweb/game.htm?lx=1&name=ty#55055776');
console.log(result);
// case 2: #
let result2 = queryURLParams('https://sports.qq.com/kbsweb/game.htm#55055777');
console.log(result2);
// case 3: ?
let result3 = queryURLParams('https://sports.qq.com/kbsweb/game.htm?lx=1&name=ty');

console.log(result3);