某暴躁程序员-CSDN博客

原创 localstorage / sessionStorage / 用法 / 周期 / 结构 / 封装

一、基本使用方法localstorage 只有在相同的协议、相同的主机名、相同的端口下才能读取或者修改同一份localstorage 数据sessionstorage比localstorage更严苛一点，除了协议、主机名、端口外还要求在同一窗口（也就是浏览器的标签页）下二、存在周期localStoragelocalStorage理论上来说是永久有效的，即不主动清空的话就不会消失，即使保存的数据超出了浏览器所规定的大小，也不会把旧数据清空而只会报错。sessionStorage

2021-09-21 16:00:33 254

原创双|| 双&& 双?? 语法使用逻辑运算符处理需要条件判断的情况（||、&&、??）

使用逻辑运算符处理需要条件判断的情况身为前端萌新的我在网上看大佬们的代码还有在培训班里讲师写的代码经常会出现||、&&、?? 这样的语法，我就很蒙蔽。在我的映像中逻辑或||逻辑与&&都是在 if 判断语句中做判断条件的于是我就简单了解一下它们在表达式中的基本用法一、双 | | 语法如果 count 没有值，则取默认值 1let count;count = count || 1;console.log(count);这里要注意一下，只有给

2021-09-15 16:04:46 806

原创 cookie/ cookie的概念/ cookie的特点/ cookie的存储形式 / cookie 的封装

cookieCookie：由于服务器无法确认用户信息，w3c提出，给每一个用户都颁发一个通行证，无论谁访问的时候都要携带该通行证，这样服务器就可以从通行证上确认用户的信息。通行证就是cookiecookie的概念客户端会话技术，将数据保存在客户端cookie 是一个以字符串的形式存储数据的位置每一个 HTTP 请求都会在请求头中携带 cookie 到服务端每一个 HTTP 响应都会在响应头中携带 cookie 到客户端也就是说，cookie 是不需要我们手动设置，就会自动在客户端和

2021-09-14 23:35:28 1374

原创数组求和 / 最大值 / 最小值一行代码拿到数组的和最大元素最小元素

一行代码数组求和取出最大值和最小值求和：在我们对数组求和的时候通常都是用循环来实现示例：let arr = [1,2,3,4,5];// 求和let getSum = 0;arr.forEach(item => { getSum += item; return getSum}) console.log(getSum)// 打印的结果是 15这里我们可以使用 reduce 方法来更简便的实现上方代码的功能只需要一行代码就可以实现哦！console.log(a

2021-09-14 21:30:12 374

原创使用promise封装的ajax

promise封装的ajax解决请求里面在套用请求问题代码：function promiseAjax(options) { return new Promise((resolve, reject) => { var xhr = new XMLHttpRequest(); // 获取请求参数 var params = formdata(options.data); //a=1&b=2 // get请求

2021-09-14 19:51:53 71

原创 Ajax的简单封装

Ajax封装function ajax(options){ var xhr = new XMLHttpRequest(); // 获取请求参数 var params = formdata(options.data); //a=1&b=2 // get请求 if (options.type=="GET") { xhr.open(options.type,options.url+'?'+params,options.isAsync);

2021-09-14 19:31:09 64

原创 CSS清除浮动清除浮动的方式有哪些伪元素清除浮动它们的优点

CSS清除浮动的方法额外标签法在最后一个浮动标签后，新加一个标签，给其设置 clear: both 不推荐优点：通俗易懂缺点：语义化差添加无意义标签父级添加 overflow: hidden 属性不推荐优点：代码简介缺点：内容过多会导致内容被隐藏掉给父级元素设高不推荐优点：代码简介易掌握缺点：只适合高度固定的布局如果高度和父级元素div高度不一样会出现问题父级添加overflow: auto属性必须定义width和zoom: 1，同时不能定义height，使

2021-09-14 18:06:49 92

原创 Ajax ajax简介 Ajax用来做什么优点 XMLHttpRequest.readyState XMLHttpRequest.status

Ajax一、Ajax的概念AJAX( Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)Ajax是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。通过在后台与服务器进行少量数据交换，Ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。传统网站（不使用ajax），如果需要更新内容，必须重载整个网页页面。二、Ajax的优势优点用户体验好，对用户的操作做出及时的响应不中断用户的操作

2021-09-14 17:37:15 89

原创 css边框三角形怎么用css样式写出三角形 css三角形怎么实现消息框

css实现边框三角形这里我就用css样式写一个下三角的样式其它方向一样只需要给不想要显实的边框设置透明色即可div{ height: 0; width: 0; border-top: 20px solid red; border-right: 20px solid transparent;/*透明*/ border-bottom: 20px solid transparent; border-left: 20px solid transparent;}...

2021-09-13 21:06:01 230

原创剩余运算符、展开运算符、解构赋值（...）用法及使用场景

剩余运算符（…）把不定数量的参数表示成为数组1. 当一个函数需要传参的时候，不知道具体参数的时候可以使用剩余运算符代替看代码：function fn(...args) { console.log("...args 打印出来的是",args)}fn(1,2,3)上边的代码打印出来的结果就是[1, 2, 3]这个数组所以说当给函数传参的时候你不知道函数的参数具体有几个就可以使用剩余运算符…来代替2. 当有两个参数的时候，我们再来看一下打印的结果又是什么呢看代码：funct

2021-09-13 20:48:04 1063 1

原创 js数组方法 map() filter() some() every() 的用法数组方法改变原数组和不改变原数组

数组方法回顾刚开始我们先回顾一下数组的其它方法在深刻的记忆不看也会忘记改变原数组的方法pop() 删除数组的最后一个元素并返回删除的元素push() 向数组的末尾添加一个元素，并返回新的长度shift() 删除并返回数组的第一个元素unshift() 向数组的开头添加一个或多个元素，并返回新的长度reverse() 反转数组的元素排序sort() 对数组的元素进行排序splice() 用于插入删除和替换数组元素不会改变原数组的：concat() 连接两个或多个数组，并返

2021-09-13 17:26:15 1750

原创数组新增 set() {12, 34, 56}、map() {“a“ =＞ 1, “b“ =＞ 2} 数据结构 Set()和Map()的属性和方法

数组新增Set数据结构Set: 数据结构，类似于数组，但是它的值不会重复值使用大括号对象形式{12，34，56}var s = new Set([12,34,12,34,56]);console.log(s); // {12, 34, 56} s并不是数组console.log(Array.from(s));// [12, 34, 56] 将伪数组转为数组var arr= [23,45,23,45];console.log(Array.from(new Set(arr))); /

2021-09-13 14:32:52 125

原创字符串新增 includes()、startsWith()、endsWith()、fromCodePoint()、repeat()、模板字符串

字符串新增方法1. str.includes('字符串') 在字符串中判断是否包含某个元素，返回布尔值2. str.startsWith('字符串') 判断字符串是否以某个字符串开始，返回布尔值3. str.endsWith('字符串') 判断字符串是否以某个字符串结束，返回布尔值4. String.fromCodePoint(ASCII编码值) 根据 ASCII 编码找到对应的字符5. str.repeat(n) 让字符串重复 n 次6. 模板字符串：字符串变量的表示${ }ES5 字符串

2021-09-13 14:02:51 130

原创 ToDoList 的实现

逻辑思路：结构：<body>  <header> <div> <h3>ToDoList</h3> <input id="add" type="text" placeholder="添加ToDo"> </div> </header> <!-- 内.

2021-07-19 16:46:39 203

原创 js模拟点名器

JS模拟点名器先看效果图：开始界面点名界面结束点名界面功能实现先画出页面1.HTML 结构部分<body> <button id="btn_start">开始点名</button> <button id="btn_end">结束点名</button> <div> <p>宋江</p> <p>李逵</p&g

2021-06-17 21:18:12 156

原创 js 模拟验证码功能

模拟验证码的实现实现思想定义一个由数字和字母大小写组成的字符串使用charAt()方法和随机数——随机获取字符串的元素使其拼接成一个四位元素的验证码Js实现代码 // 声明一个由数字和字母大小写组成的字符串 var str = '0123456789qwertyuiopASDFGHJKL'; // 空字符串后边拼接使用 var newStr = ''; console.log(str.length); //生成四位数的验证码 for(var i

2021-06-16 20:34:20 430

原创 indexOf() 数组去重

indexOf数组去重的两种方法第一种写法 var arr = [1,2,3,3,2,1]; var newArr = []; for(var i = 0; i < arr.length; i++){ if(newArr.indexOf(arr[i]) == -1){ newArr.push(arr[i]) } } console.log(newArr)第二种写法 var arr = [1,2,3,3,2,1];

2021-06-15 23:45:37 332 1

原创数据类型转换

数据类型转换基本数据类型：string(字符串)、number(数字)、boolean(布尔)、undefined(未定义)、null(空)转数值：Number() — 将纯数字的字符串转为数字类型，会将true转为1，将false转为0Number('100') //100Number('10aa') //NaNNumber('abc') //NaNNumber(true) //1Number(flase) //0parseInt() — 将数字开头的字符串转为数值类型且保留整

2021-06-13 00:13:03 179

JC_5445的博客