在使用 JavaScript 时,通常需要获取查询字符串值。
在这个片段中,我们将为我们提供几种有效的解决方案,以防止获取特定查询字符串或者所有查询字符串。
如何获取所有查询字符串
获取所有查询字符串与获取单个查询字符串不同。
让我们看看如何在以下代码片段的帮助下解决这个问题:
const getQueryParams = (url) => { let qParams = {}; //创建绑定标签以使用名为 search 的属性 let anchor = document.createElement('a'); //将url分配给锚标签的href URL anchor.href = url; //search 属性返回 URL 查询字符串 let qStrings = anchor.search.substring(1); let params = qStrings.split('&'); for (let i = 0; i < params.length; i++) { let pair = params[i].split('='); qParams[pair[0]] = decodeURIComponent(pair[1]); } return qParams; }; console.log(getQueryParams('http://onitroad.com?example=something&data=24'));
在这里创建一个锚元素并在元素中使用一个名为 search 的属性。
search 属性完全返回 queryString。
创建锚元素并将url赋值给href后,search返回url的查询字符串。
完成所有这些工作后,我们可以通过使用 & 关键字拆分字符串来获取所有查询参数。
如何获取特定的查询字符串
可以使用纯 JavaScript 或者 jQuery 获取查询字符串值。
要实现它,请创建一个函数,例如 getQueryParams 并添加以下代码:
const getQueryParams = ( params, url ) => { let href = url; //this is an expression to get query strings let regexp = new RegExp( '[?&]' + params + '=([^&#]*)', 'i' ); let qString = regexp.exec(href); return qString ? qString[1] : null; }; console.log(getQueryParams('data','http://onitroad.com?example=something&data=32'));
该函数以 params 和 url 作为参数。
其中我们将 url 分配给函数内的变量 href。
正则表达式模式检查以 & 或者 ?其次是传递的参数。
它获取 = 之后的值并将其存储在 queryString 中并返回它。
日期:2020-06-02 22:16:19 来源:oir作者:oir