先上代码
var url = new URL("https://www.baidu.com/s?wd=%E2%80%9C%E5%8D%B0%E5%BA%A6%E5%88%B6%E9%80%A0%E2%80%9D%E6%8C%91%E6%88%98%E2%80%9C%E4%B8%AD%E5%9B%BD%E5%88%B6%E9%80%A0%E2%80%9D%EF%BC%9F&rsv_idx=2&tn=baiduhome_pg&ie=utf-8&rsv_pq=a030fb450001560a&oq=URLSearchParams&rsv_t=ffef3M86%2BydHr8QY4E1XqDq8ehTgIeB45QYM7a10slr%2FI5okYJlF8yryJ2KE2TLcbPs6&rqid=a030fb450001560a&rsf=b387b176e09280bbdef0d2f1a2c0e56e_1_15_11&rsv_dl=0_right_fyb_pchot_20811&sa=0_right_fyb_pchot_20811");var searchParams3 = new URLSearchParams(url.search);for(var pair of searchParams3.entries()) { console.log('================='); console.log(pair[0]+ ', '+ pair[1]);}
输入后果
URLSearchParams
- URLSearchParams.append(),插入一个指定的键/值对作为新的搜寻参数。
- URLSearchParams.delete(),从搜寻参数列表里删除指定的搜寻参数及其对应的值。
- URLSearchParams.entries(),返回一个iterator能够遍历所有键/值对的对象。
- URLSearchParams.get(),获取指定搜寻参数的第一个值。
- URLSearchParams.getAll(),获取指定搜寻参数的所有值,返回是一个数组。
- URLSearchParams.has(),返回 Boolean 判断是否存在此搜寻参数。
- URLSearchParams.keys(),返回iterator 此对象蕴含了键/值对的所有键名。
- URLSearchParams.set(),设置一个搜寻参数的新值,如果原来有多个值将删除其余所有的值。
- URLSearchParams.sort(),按键名排序。
- URLSearchParams.toString(),回搜寻参数组成的字符串,可间接应用在 URL 上。
- URLSearchParams.values(),返回iterator 此对象蕴含了键/值对的所有值。
两个问题
- entries,keys,values办法返回的是遍历器,不是数组
- URLSearchParams 不会解析残缺 URL,然而如果字符串起始地位有 ? 的话会被去除。他是解析url查问字符串的
看代码
var paramsString1 = "http://example.com/search?query=%40";var searchParams1 = new URLSearchParams(paramsString1);searchParams1.has("query"); // falsesearchParams1.has("http://example.com/search?query"); // truesearchParams1.get("query"); // nullsearchParams1.get("http://example.com/search?query"); // "@" (equivalent to decodeURIComponent('%40'))var paramsString2 = "?query=value";var searchParams2 = new URLSearchParams(paramsString2);searchParams2.has("query"); // truevar url = new URL("http://example.com/search?query=%40");var searchParams3 = new URLSearchParams(url.search);searchParams3.has("query") // true
如上,"http://example.com/search?query"会被当做键值对的一个key来解析
示例起源MDN