轉載自??URLSearchParams 接口

URLSearchParams?接口定義了很多個用來處理 URL 參數串的方法。

---

基本使用方法如下

var paramsString = "q=URLUtils.searchParams&topic=api" // location.search.slice(1) var searchParams = new URLSearchParams(paramsString);searchParams.has('topic') // true searchParams.get('topic') // "api" searchParams.getAll('topic') // ["api"]searchParams.get('foo') // null，注意Firefox返回空字符串 searchParams.set('foo', 2); searchParams.get('foo') // 2searchParams.append('topic', 'webdev'); searchParams.toString() // "q=URLUtils.searchParams&topic=api&foo=2&topic=webdev"searchParams.append('foo', 3); searchParams.getAll('foo') // [2, 3]searchParams.delete('topic'); searchParams.toString() // "q=URLUtils.searchParams&foo=2&foo=3"

---

URLSearchParams?還有三個方法返回迭代器對象：
keys()?遍歷所有參數名
values()?遍歷所有參數值
entries()?遍歷所有參數的鍵值對

---

URLSearchParams實例可以當作POST數據發送，所有數據都會URL編碼。

fetch('https://example.com/api', {method: 'POST',body: params }).then(...)

---

DOM 的 a 元素節點的?searchParams?屬性，就是一個?URLSearchParams?實例。

var a = document.createElement('a'); a.href = 'https://example.com?filter=api'; a.searchParams.get('filter') // "api"

URLSearchParams?還可以與?URL?接口結合使用。

var url = new URL(location); var foo = url.searchParams.get('foo') || 'somedefault';

?

總結

以上是生活随笔為你收集整理的URLSearchParams 接口的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。