- 博客(40)
- 收藏
- 关注
RSS订阅原创 【无标题】
作用：控制元素的显示隐藏.语法：v-show = "表达式" 表达式值为true显示，false隐藏底层原理：通过切换 css 的 display：none 来控制显示或隐藏使用场景：频繁切换显示隐藏的场景。作用：控制元素的显示隐藏（条件渲染）语法：v-if= "表达式" 表达式值为true显示，false隐藏底层原理：根据 判断条件 控制元素的 创建 和 移除使用场景：要么显示要么隐藏，不频繁切换的场景。语法：v-bind ：属性名 = "表达式" 语法简写：：属性名 = "表达式"
2023-12-15 21:03:17
73
原创 webpack
将图片文件单独打包成一个文件，保存到打包目录，再使用url(file:///d:/xxx/xxx) 就相当于将原图片，复制到了另个新的位置，改了名，url再指向新的位置即可。在webpacke5.0中无需下载安装图片对应的loader(模块)，因为内嵌了对象图片资源处理的模块，可以直接使用内置的资源模块进行处理(asset/modules) 内置了四种处理图片的资源模块。对文件内容进行特定的处理。当一个项目开发完毕后，要对项目的代码进行最终的打包，最终的打包，要以production模式进行。
2023-12-15 20:23:34
178
原创 git 常用部分方法
git checkout -- file // 撤销工作区的修改 例如git checkout -- readMe.txt 将本次readMe.txt在工作区的修改撤销掉。git mv b ./demos/ // 把b文件移动到demos文件夹下。git clone -b 分支名 地址 // 克隆分支的代码到本地。git checkout -b 分支名 // 创建并切换分支。git merge -- abort//中止分支合并。git branch -d 分支名 // 删除分支。
2023-12-07 19:22:56
316
原创 promise方法
Promise.allSettled()所有的Promise对象均出现结果（无论成功或失败）后才会执行allSettled中的then回调（只会进入then回调） 在所有 Promise 对象都 settle 后返回一个新的 Promise 对象，该对象的 Fulfill 状态的值是一个数组，包含每个 Promise 对象的 settle 状态信息（即不管 resolve 还是 reject 都会被处理）注意：若有错误抛出，则抛出错误信息，并终止函数。async函数一定会返回一个promise对象。
2023-12-01 20:53:01
133
原创 class promise
注意函数声明和类声明之间的一个重要区别在于，函数声明会提升，类声明不会。需要先声明类，然后再访问它，否则就会出现ReferenceError函数受函数作用域限制，而类受块作用域限制。class就是构造函数的语法糖，在使用继承的时候会更加方便，并且在思想上和java等统一起来。constructor 方法是一个特殊的方法，这种方法用于创建和初始化一个由。同步 代码依次执行，上一个任务完成后，下一个任务才执行。该参数函数立即调用，该执行函数可以放同步或异步任务，类的数据类型就是函数，类本身就指向构造函数。
2023-11-30 19:07:53
129
原创 ES6 generator Symbol yield
yield是ES6的新关键字，使生成器函数执行暂停，yield关键字后面的表达式的值返回给生成器的调用者。yield关键字实际返回一个IteratorResult（迭代器）对象，它有两个属性，value和done，分别代表返回值和是否完成。yield无法单独工作，需要配合generator(生成器)的其他函数，如next，懒汉式操作，展现强大的主动控制特性。生成器函数(generator)-生成迭代器(Iterator)的函数,配合yield关键字来控制代码执行流程。for-of遍历迭代器。
2023-11-29 19:33:46
194
原创 运算符展开、函数，对象，数组，字符串变化 集合
WeakMap 它的键只能是对象,一个对象作为 WeakMap 的键存在，不会阻止该对象被垃圾回收性能更好。利用set集合实现数组去重 对原数组进行遍历,判断每个元素不在新数组中，加到新数组中。当对象的属性名和值的变量名或常量名一样 可以省略冒号+变量名。hasOwnProperty() 判断某个属性是否是自身。... 展开运算符 用于函数实参或者赋值号右边。... 剩余运算符 用于赋值号左边或函数形参。集合-Set集合不能重复。判断集合是否含有某个元素。
2023-11-28 19:28:36
182
原创 防抖与节流
防抖是触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间。适用于可以多次触发但触发只生效最后一次的场景。节流是高频事件触发，但在n秒内只会执行一次，如果n秒内触发多次函数，只有一次生效，节流会稀释函数的执行频率。防抖 - 在同一时间内 频繁触发事件,只处理最后一次。节流 - 在同一时间内 频繁触发事件,只执行一次。
2023-11-24 19:20:46
54
原创 深拷贝 浅拷贝 递归
浅拷贝指的是创建一个新对象，其中包含原始对象的引用（指针），并没有真正将原始对象的数据复制到新对象中，因此新对象与原始对象共享部分或全部数据。深拷贝指的是创建一个新对象，并递归地将原始对象的数据复制到新对象中，因此新对象与原始对象之间不存在数据共享。深拷贝 JSON.stringify 与 JSON.parse。浅拷贝方式一Object.assign(目标对象 ，源对象)浅拷贝:拷贝的对象和源对象相互有影响。深拷贝:拷贝的对象和源对象没有影响。深拷贝 自己实现 递归。浅拷贝方式二： 展开运算符。
2023-11-23 19:45:26
232
原创 继承垃圾回收机制
JS为我们声明的变量、函数等分配内存，当这些变量、函数、对象的内存不再使用->垃圾。参数 第一个参数是this指，第二个参数是一个数组，数组里放的是传递给函数的实参。原型继承->儿子的原型指向父实例对象，这样父实例对象的成员就可以实现继承。bind返回值一个新函数(改变this指向之后的函数),不会立即调用。call函数作用 1 让函数执行 2 改变函数this指向。参数 第一个参数是this指，第二个参数开始传递给函数的实参。参数 第一个参数是this指，第二个参数开始就是实际的参数。
2023-11-22 17:01:06
51
原创 原型 原型对象 原型链
每一个实例对象又有一个proto属性，指向的构造函数的原型对象，构造函数的原型对象也是一个对象，也有proto属性，这样一层一层往上找就形成了原型链。原型: JS为每个构造函数提供一个属性prototype(原型),它的值是一个对象，prototype也叫原型对象。3 假如原型对象上也没有，再找原型对象的__proto__ ,一直找到Object.prototype。2 自身没有该成员，通过__proto__找到原型对象，看原型对象上有没有，有就执行。原型为了共享公共的成员 prototype。
2023-11-21 20:13:30
249
原创 构造函数 调用
使用对象字面量创建一系列同一类型的对象时，这些对象可能具有一些相似的特征(属性)和行为(方法)，把这些重复性的特征和属性抽象出来，做成构造函数，可以实现代码复用，减少代码量。没有指定初始值，prev第一次就指向数组第一个元素，current指向第二个元素,以后的prev是上一次函数返回值。第一次 prev指向第一个元素 current 指向第二个 元素 index是current指向的元素的下标。findIndex() 查找满足条件的第一个元素的索引 找到就返回该元素的索引，找不到是-1。
2023-11-20 18:21:58
42
原创 BOM 浏览器对象模型
接受一个整数作为参数，以当前网址为基准，移动到参数指定的网址，比如go(1)相当于forward()，go(-1)相当于back()。正则表达式也是对象。navigator对象包含有关浏览器的信息，它有很多属性，我们最常用的是userAgent该属性可以返回由客户机发送服务器的 user-agent 头部的值。传统注册事件方式,只能写一次,若有多个,以最后一个 window.onload 为准,前边的都会被覆盖。当页面内容完全加载完成之后会触发该事件(含图像,脚本文件,css,文件等),就调用的处理函数。
2023-11-17 17:54:00
35
原创 节点操作 鼠标移入
HTML DOM 树中的所有节点均可通过 JavaScript 进行访问，所有 HTML 元素（节点）网页中的所有内容都是节点（如：标签、属性、文本、注释等），在DOM 中，节点使用 node。通过节点关系查找元素 父亲 语法：元素.parentNode。获取子节点 语法：元素.children。节点操作(增 删 改 查)删除元素 元素.remove()touchstart触摸开始。touchmove一直触摸。touchend触摸结束。均可被修改、创建或删除。
2023-11-16 19:23:00
30
原创 事件 捕获 冒泡
从DOM的 根元素 开始去执行对应的事件 ( 从外到里、父到子 )原理：事件委托其实是利用 事件冒泡 的特点给 父元素注册事件 ，当我们触发子元素的时候，会冒泡到父元素身上，从而触发父元素的事件。当一个元素的事件被触发时，同样的事件将会在该元素的所有祖先元素中 依次被触发。offsetTop -- 元素顶部到有定位父元素顶部的距离,如果父元素没有定位就以body为参照。阻止 元素发生 默认的行为；当一个元素的事件被触发时，会从DOM的根元素开始依次调用 同名事件 ( 从外到里 )
2023-11-15 16:42:59
38
原创 焦点 键盘事件 事件对象 排他思想
焦点：使浏览器能够区分用户输入的对象，当一个元素有焦点的时候，那么他就可以接收用户的输入只有能够响应用户操作额元素才可以接收焦点事件，比如：a button input...表单获得光标：获得焦点focus失去焦点blur。
2023-11-14 14:15:07
38
原创 dom 定时器简介
获取元素console.dir(box.className) // 原生属性 元素.原生属性名元素.getAttribute('属性名') 获取元素属性名元素.setAttribute('属性名',值) 设置元素属性针对data-开头的自定义属性名box.dataset.info = 123 // 添加一个属性data-info。
2023-11-13 16:30:03
37
原创 dom基础及基础操作
DOM是JS操作网页的接口，全称为“文档对象模型”（Document Object Model）。它的作用是将网页转为一个JS对象，从而可以用脚本进行各种操作（比如增删内容）文档的树形结构（DOM树），就是由各种不同类型的节点组成。元素的属性 表示的是标签中的一个一个的属性，这里要注意的是属性节点并非是元素节点的子节点，而是元素节点的一部分。整个HTML文档document对象作为window对象的属性存在的，我们不用获取可以直接使用。返回满足条件的第一个元素(dom元素对象),找不到返回null。
2023-11-12 20:20:45
32
原创 日期对象 随机取整 字符串部分方法
执行区分大小写的搜索，以确定是否可以在一个字符串中找到另一个字符串，并根据情况返回 true 或 false 返回字符串是否包含指定值。判断当前字符串是否以另外一个给定的子字符串开头，并根据判断结果返回 true 或 false 检查字符串是否以指定字符开头。在字符串中搜索指定子字符串，并返回其第一次出现的位置索引 返回值在字符串中第一次出现的位置。搜索该字符串并返回指定子字符串最后一次出现的索引 返回值在字符串中最后一次出现的位置。将字符串参数连接到调用的字符串，并返回一个新的字符串。
2023-11-09 17:11:49
46
原创 对象的基本知识
如果一个键的值是一个函数，则称这个键名为这个对象的方法。如果一个键的值是基本数据类型，则称这个键名为这个对象的属性。对象为了描述客观事物{ 属性名: 值,属性名: 值,属性名: 值} 若干个键(key)值(value)对。属性名明确的话 两种形式都可以，属性名存在变量里或者属性名含有特殊符号的，只能用中括号。值:相当于属性值：可以是任意类型的值（数字、字符串、布尔值、函数等）对象名都是字符串,属性名没有特殊符号的时候，字符串引号可以省略。查 对象名.成员或 对象名['属性名']
2023-11-08 14:54:56
56
1
原创 函数声明及调用
js代码在执行的时候，分为预解析(把var定义变量或函数声明拿到代码最前面)和代码执行、具名函数与函数表达式区别 普通函数可以先调用后声明 函数表达式必须先声明才调用。作用： 作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字冲突。访问原则：在能够访问到的情况下先局部， 局部没有再找全局，总结： 就近原则。分类: 全局作用域、局部作用域(函数作用域 、块级作用域)局部作用域-函数作用域 作用于 函数内 的代码环境。作用域-变量或函数的使用有效范围。具名函数 ：带有名字的函数。
2023-11-07 15:20:40
31
原创 js数组部分应用
Array.isArray()通过构造函数直接调用的方法-静态方法用于确定传递的值是否是一个数组。可以指定一个可选的字符串在生成的字符串中来分割数组的各个元素。数组名.splice(起时索引,删除元素个数,要添加的元素,要添加的元素,...)join()方法将数组中所有元素都转化为字符串并连接在一起，返回最后生成的字符串。此方法不会更改现有数组，而是返回一个新数组。方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回。新数组=所需合并的其中一个数组.conact（其余数组，其余数组）
2023-11-04 10:56:05
37
1
原创 js数组部分基础
访问元素 数组名[下标/角标/索引] 下标 0 1 2 ... 通常是从0~元素个数-1。数组遍历 arr.length 元素的个数->长度。功能：在数组的末尾追加一个或多个元素。功能：在数组的前面追加一个或多个元素。语法 数组名.unshift(参数)返回值 元素添加之后的数组总长度。参数、一个或多个要追加的元素。参数、一个或多个要追加的元素。返回值 元素添加之后的数组总长度。语法 数组名.push(参数)语法 数组名.shift()功能：删除数组末尾的元素。语法 数组名.pop()
2023-11-02 20:01:26
32
1
原创 js结构 循环
2 去找对应匹配(严格等于)的case,找到的话，执行该case冒号后面的语句，遇到break结束或遇到} 找不到匹配的case，则执行default，遇到break结束或遇到}反复操作上述两步，直到条件表达式的值为假时，跳出while循环，继续执行后面的语句。在执行循环体的时候如果遇到break，整个循环结束（循环体后面的代码不执行，直接退出循环）3 循环体执行完毕,执行表达式3，然后再回到第二步直至表达式2成立结束循环。2 执行表达式2，表达式2的结果是true,则执行循环体。for(表达式 1;
2023-11-01 20:11:06
33
1
原创 js基础知识二
判断表达式1的值，转布尔类型假如为true，直接返回表达式1的值 表达式1的值转布尔类型假如为false,直接返回表达式2的值,判断表达式1的值，转布尔类型假如为true，直接返回表达式2的值 表达式1的值转布尔类型假如为false,直接返回表达式1的值。console.log('1' + 2) // 字符串参与的加其实是拼接 '1' + '2' -> '12'逻辑与短路现象 表达式1的值转布尔类型假如为false,直接返回表达式1的值,此时不会执行表达式2的值。逻辑与 表达式1&&表达式2。
2023-10-31 21:00:30
28
1
原创 js基础知识
定义多个变量 let a,b,c=20注意 名字组成部分1 数字 中文 字母 _ $2 不能以数字开头3 区分大小写4 不能是关键字 let if else for ...5 有意义 name age score ...6 小驼峰命名 studentName, getElementById变量值存储在内存空间的数据。
2023-10-31 12:17:31
48
1
原创 浮动 表格 高度塌陷
并且将所有的tr都放到tbody中，所以注意tr并不是table的子元素，而是tbody的子元素。1、一旦元素设置了浮动，元素就会脱离文档流，它原来在文档流得位置，元素原来在文档流得特点，就都没有了，也就是说不再区分块，行内，行内块。2、如果浮动元素它上面的元素不浮动，则浮动元素无法上移。然而子元素若设置浮动，就会脱离文档流，也就撑不开父元素的高度。这时就需要将表格分为三个部分，表头，表格的主体，表格底部。当元素设置浮动以后，会完全脱离文档流，元素脱离文档流后，这也是设置浮动最开始的想要的效果。
2023-10-30 10:29:28
51
原创 过渡约束 垂直外边距的重叠 默认样式
*** margin-left，margin-right为auto，width为固定值 同时调整margin-left，margin-right。2、如果有auto，margin-left，width，margin-right可以被设置为auto。margin-left，width为auto，margin-right为固定值 调整width。margin-left，width，margin-right为auto 调整的width。3: 可以设置边框，但是垂直的边框不会影响到页面的布局，不会挤别人。
2023-10-26 17:15:19
19
原创 盒模型 内容区 内边距 边框 外边距
元素自己不动，正值挤着下面的元素向下，负值下面的元素向上。也可跟多个值，规则跟border-width一样。也可跟多个值，规则跟border-width一样。将一个内容放在页面合适的位置，需要考虑到这个内容大小，位置，形状，就相当于，买一个家具。也可跟多个值，规则跟border-width一样。可以跟多个值，规则跟border-width一样。边框属于盒子边缘，边框里面属于盒子内部，出了边框都是盒子的外部。
2023-10-26 16:32:40
67
原创 文本基本属性
参数4:阴影的颜色 用rgba(0, 128, 0,.5)比较多 选写 默认值是字体的颜色。参数4:阴影的颜色 用rgba(0, 128, 0,.5)比较多 选写 默认值是黑色。参数1: 阴影的水平位移距离 正值向右，负值向左 必写。参数2: 阴影的垂直位移距离 正值向下，负值向上 必写。参数1: 阴影的水平位移距离 正值向右，负值向左 必写。参数2: 阴影的垂直位移距离 正值向下，负值向上 必写。line-through 删除线。right 右对齐。
2023-10-26 16:21:54
36
原创 颜色 字体 行高
颜色单位：1:在CSS可以直接使用颜色的单词来表示不同的颜色比较少用2:使用RGB值来表示不同的颜色rgb(red,green,blue) 通过三元色不同的颜色比值，勾兑出各种颜色0-2550最小 255最大截取颜色，alt+ctrl+a3:RGBAalpha 透明度 0-1 0表示透明，1表示不透明4:使用十六进制的rgb值来表示颜色，原理和上边RGB原理一样十六进制 0-9abcdef语法：#红色绿色蓝色。
2023-10-19 12:50:23
64
1
原创 CSS部分选择器二
优势：方便我们开发，讲一些通用的样式统一设置到共同的祖先元素上，定义：为一个元素设置的样式，同时也会应用到它的后代元素上。类选择器（包括伪类选择器、属性选择器） 10。如果设置样式没有生效，要么是没选中，要么是权重的问题，子元素的样式都可以获取到样式。2、多个选择器共同使用，则最终权重是多个选择器权重相加。是所有的样式都会被继承，比如：背景相关的，布局相关等不会被继承。伪元素，表示页面中一些特殊的并不真实存在的元素（元素的位置）3、如果选择器是并集选择器，则选择器的权重各算各的。
2023-10-16 20:53:07
44
1
原创 CSS部分选择器1
作用：通过对应class属性值选中内容，跟id选择器很像，不同的是class属性值可重复使用。注意：如果选择器中有标签选择器，那么标签选择器必须放在第一位。作用： 同时符合选择器1选择器2···对应的内容。在选择器1或者选择器2或者····里面的内容。语法：选择器1,选择器2,····{}作用：通过指定的祖先元素找到指定的后代元素。语法： 选择器1选择器2····{}作用：通过指定的父元素找到指定的子元素。作用：通过id属性值，选中对应的内容。注意：会波及其他的同标签名的内容。作用：选中页面中所有的标签。
2023-10-16 20:50:39
39
1
原创 CSS介绍
网页实际上是一个多层的结构，通过css可以分别为网页的每一层来设置样式。写在head标签内，写一个style标签，在style标签内，通过选择器，选中对应的内容。CSS的注释，作用和HTML注释类似，只不过它必须编写在style标签中，或者是css文件中。写在开始标签或者自结束标签内部，写一个style属性，将css样式写在属性值。color：red；缺点：1、css样式，还是写在html文件内部，会导致代码量很多。在{}内设置css样式，可以写多组样式，用;1、html结构和css样式耦合了，不好看。
2023-10-13 18:39:55
23
原创 常用的列表
1、常用的ul，ol，在实际开发过程中，不会特别区分有序或者无序。4、ul ol 有一个属性 type属性，可以更改项目符号。6、列表的默认样式一般情况下，是不需要，后期写样式之前需要去除。默认样式：默认加项目符号123，列表项前面有一定间距。默认样式：加项目符号黑心圆，列表项前面有一定间距。用dl创建，dt表示下定义 dd表示具体内容。3、ul ol li dl dt dd 都是块元素。circle，空心的圆。用ol创建 li表示每个列表项。用ul创建，li表示每个列表项。
2023-10-08 08:51:06
110
1
原创 标签的分类
4、特殊的行内元素 a 里面什么都能放，可以放块元素，行内元素，行内块元素。2、默认情况，块标签宽度是父元素的100%，高度是被内容撑开的。1、兼具块标签和行内标签的特点，即是不会独占一行，可以设置宽高。1、块元素里面可以放任何内容，包括块元素，行内元素，行内块元素。3、特殊的块元素 p 里面只放文字或者图片，不能放块元素。2、默认情况，行内标签宽高是被内容撑开的。2、标签和标签之间有大概3像素的空白间隙。2、行内元素里面一般就包裹文字，里面不能放块元素。行内块标签（行内块元素）
2023-10-08 08:45:21
169
1
原创 HTML基本知识
默认样式：字体加粗，从h1-h6,字体是逐步放小，行与行之间的间距比较大，独占一行。html根标签 一个页面就一个根标签 所有的内容都要写在根标签里面。浏览器在编译代码时，也要按照html规范来编译，防止出现怪异模式。文档声明 告诉浏览器我们写的代码是按照html文档类型来写的。head标签 帮助浏览器编译代码，里面的内容，用户一般看不到。body标签 是书写网页主体内容，用户看到的所有内容。meta标签是根据其配置的属性和属性值来确定功能。文字，图片，音视频等等都写在body。
2023-09-25 14:58:48
39
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人