本章将和大家分享JS中URLSearchParams的基本用法。话不多说,下面我们直接来看代码。
一、JS中URLSearchParams的基本用法
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content=">
<title>JS中URLSearchParams的基本用法title>
<script src="/lib/vue.js">script>
<script src="/lib/axios.js">script>
head>
<body>
<div id="app">
<input type="button" value="测试" @click="testURLSearchParams">
div>
<script>
var vm = new Vue({
el: "#app",
data: {
msg: "Hello Vue!"
},
methods: {
//测试URLSearchParams
//参考博文:https://www.cnblogs.com/zshno1/p/15993017.html
testURLSearchParams: function () {
var _this = this; //方法中通过this关键字获取data中的数据
var url = new URL(`https://www.baidu.com?a=1&b=2`);
var searchParams = new URLSearchParams(url.search);
//1、toString() 返回适用在URL中的查询字符串
console.log(searchParams.toString()); //输出:a=1&b=2
console.log(Object.fromEntries(searchParams.entries())); //输出:{a: "1", b: "2"}
//2、append(name,value) 插入一个指定的键/值对作为新的搜索参数
searchParams.append("c", 3);
console.log(searchParams.toString()); //输出:a=1&b=2&c=3
console.log(Object.fromEntries(searchParams.entries())); //输出:{a: "1", b: "2", c: "3"}
//3、delete(name) 删除指定名称的所有搜索参数
searchParams.delete("c");
//4、get(name) 获取指定搜索参数的第一个值
console.log(searchParams.get("a")); //输出:1
//5、getAll(name) 获取指定搜索参数的所有值,返回是一个数组
console.log(searchParams.getAll("a")); //输出:["1"]
//6、has(name) 判断是否存在此搜索参数
console.log(searchParams.has("a")); //输出:true
//7、set(name, value) 设置相关联的值,已存在则覆盖
searchParams.set("a", 11);
searchParams.set("d", 4);
console.log(Object.fromEntries(searchParams.entries())); //输出:{a: "11", b: "2", d: "4"}
//8、entries() 返回一个iterator可以遍历所有键/值对的对象
var paramArr = searchParams.entries();
for (var item of paramArr) {
console.log(item); //依次输出:["a", "11"],["b", "2"],["d", "4"]
}
//9、此外还有 keys()/values()/sort(name, value) 等方法,此处就不再一一列举了。
},
//URLSearchParams实践
getData: function () {
var _this = this;
var params = new URLSearchParams();
params.append("action", "getData");
params.append("pageIndex", 1);
params.append("pageSize", 15);
axios.post("/Ashx/Epc/ThirdInterfaceDataHandler.ashx", params)
.then(function (result) {
console.log(result);
})
.catch(function (error) {
console.log(error);
});
}
}
});
//C#中计算分页数
//totalCount:总记录数;pageSize:页大小;totalPage:总页数
//var totalPage = (totalCount + pageSize - 1) / pageSize; //计算分页数
script>
body>
html>
二、C#中计算分页数
//totalCount:总记录数;pageSize:页大小;totalPage:总页数 var totalPage = (totalCount + pageSize - 1) / pageSize; //计算分页数
三、JS中判断数组中是否包含某元素的方法
var fruits = ["Banana", "Orange", "Apple", "Mango"]; if (fruits.indexOf("Apple") > -1) { //存在 console.log(fruits.indexOf("Apple")); //输出:2 }
Demo源码:
链接:https://pan.baidu.com/s/1NLLD73m048F-59WMOtOTCw 提取码:t0k8
此文由博主精心撰写转载请保留此原文链接:https://www.cnblogs.com/xyh9039/p/16977068.html
版权声明:如有雷同纯属巧合,如有侵权请及时联系本人修改,谢谢!!!