
学习整理-web前端
文章平均质量分 93
web
是三好
大鹏一日同风起 扶摇直上九万里
展开
-
11-Webpack模块打包工具
了解 Webpack 的概念和作用,以及使用。原创 2023-10-07 23:20:45 · 902 阅读 · 0 评论 -
10-Node.js模块化
了解模块化概念和好处,以及 CommonJS 标准语法导出和导入把上面学的模块化语法,包的概念,常用命令进行总结。原创 2023-10-07 22:59:55 · 470 阅读 · 0 评论 -
10-Node.js入门
什么是 Node.js,有什么用,为何能独立执行 JS 代码,演示安装和执行 JS 文件内代码。原创 2023-10-07 22:31:52 · 583 阅读 · 0 评论 -
9-AJAX-下-axios
上古浏览器页面在向服务器请求数据时,因为返回的是整个页面的数据,页面都会强制刷新一下,这对于用户来讲并不是很友好。并且我们只是需要修改页面的部分数据,但是从服务器端发送的却是整个页面的数据,十分消耗网络资源。而我们只是需要修改页面的部分数据,也希望不刷新页面,因此异步网络请求就应运而生。Ajax(Asynchronous JavaScript and XML):异步网络请求。Ajax能够让页面无刷新的请求数据。原创 2023-10-07 21:26:29 · 743 阅读 · 0 评论 -
9-AJAX-上-原理详解
Ajax:即异步 JavaScript 和XML。Ajax是一种用于创建快速动态网页的技术。通过在后台与进行少量数据交换,Ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。而传统的网页(不使用 Ajax)如果需要更新内容,必需重载整个网页面。原创 2023-10-07 21:25:43 · 1526 阅读 · 0 评论 -
8-js高级-7(理解js的事件循环)
JS引擎之所以是单线程,是由于JavaScript最初是作为浏览器脚本语言开发的,并且JavaScript需要操作DOM等浏览器的API,如果多个线程同时进行DOM更新等操作则可能会出现各种问题(如竞态条件、数据难以同步、复杂的锁逻辑等),因此将JS引擎设计成单线程的形式就可以避免这些问题。现在有2个线程,process1 process2,由于是多线程的JS,所以他们对同一个dom,同时进行操作;原创 2023-07-26 22:14:38 · 352 阅读 · 0 评论 -
8-js高级-6(promise)
async 函数1)函数的返回值为Promise对象2)Promise对象的结果由async函数执行的返回值决定await 表达式1)正常情况下,await右侧的表达式一般为promise对象, 但也可以是其它的值2)如果表达式是promise对象,await就忙起来了,它会阻塞函数后面的代码,等着Promise对象resolve,然后得到resolve的值,作为await表达式的运算结果。3)如果表达式是其它值, 直接将此值作为await的返回值async和await。原创 2023-07-26 14:48:07 · 278 阅读 · 0 评论 -
8-js高级-5(数组新函数)
/true//判断哪个数组全由偶数组成:// 三个变量名都能换// 但是顺序不能变// 当前元素值 下标 数组vareveryfunctionvalueiarrlogarr1.every()自动调用了一次回调函数;自动传入arr1数组:[${arr。原创 2023-07-11 21:03:21 · 232 阅读 · 0 评论 -
8-js高级-4
浅拷贝:把对象拷贝给一个新的对象,开发中我们经常需要复制一个对象如果直接赋值,则复制的是地址,修改任何一个对象,另一个对象都会变化// 浅拷贝方法// 1. 对象拷贝// name: '佩奇'// }// newObj.name = '乔治'// 1.2 展开运算符// newObj.name = '乔治'// // 2. 数组拷贝// const arr = ['佩奇', '乔治']// 2.1 concat 方法实现数组浅拷贝// newArr[1] = '猪爸爸'// 2.2 展开运算符。原创 2023-07-11 10:18:20 · 285 阅读 · 0 评论 -
8-js高级-3
父对象中的成员,子对象无需重复创建,就可直接使用!原创 2023-07-06 19:59:47 · 196 阅读 · 0 评论 -
8-js高级-2
了解面向对象编程的基础概念及构造函数的作用,体会 JavaScript 一切皆对象的语言特征,掌握常见的对象属性和方法的使用。原创 2023-07-03 21:20:19 · 232 阅读 · 0 评论 -
8-js高级-1
JavaScript 进阶 - 1学习作用域、变量提升、闭包等语言特征,加深对 JavaScript 的理解,掌握变量赋值、函数声明的简洁语法,降低代码的冗余度。作用域函数进阶解构赋值综合案例作用域了解作用域对程序执行的影响及作用域链的查找机制,使用闭包函数创建隔离作用域避免全局变量污染。作用域(scope)规定了变量能够被访问的“范围”,离开了这个“范围”变量便不能被访问,作用域分为全局作用域和局部作用域。局部作用域局部作用域分为函数作用域和块作用域。函数作用域在函数内原创 2023-07-03 21:15:37 · 232 阅读 · 0 评论 -
7-WebApis-6
目标:能够利用正则表达式完成小兔鲜注册页面的表单验证,具备常见的表单验证能力。原创 2023-07-03 20:05:06 · 310 阅读 · 0 评论 -
7-WebApis-5
目标: 能够利用JS操作浏览器,具备利用本地存储实现学生就业表的能力。原创 2023-07-03 19:36:29 · 325 阅读 · 0 评论 -
7-WebApis-4
目标: 了解DOM节点的增删改查,掌握利用数据操作页面,完成移动端通讯录案例。原创 2023-06-28 17:43:58 · 340 阅读 · 1 评论 -
7-WebApis-3
目标:学习事件流,事件委托,其他事件等知识,优化多个事件绑定和实现常见网页交互。原创 2023-06-28 14:38:57 · 182 阅读 · 0 评论 -
7-WebApis-2
掌握事件绑定处理和事件对象,完成常见网页交互。原创 2023-06-27 21:13:06 · 306 阅读 · 0 评论 -
7-WebApis-1
Web APIs - 1掌握DOM属性操作,完成元素内容设置,元素属性设置,控制元素样式DOM简介获取DOM元素操作元素内容操作元素属性定时器-间隔函数综合案例描述属性/方法效果获取DOM对象document.querySelector()获取指定的第一个元素document.querySelectorAll()获取指定的所有元素操作元素内容元素.innerText操作元素内容,不解析标签元素.innerHTML操作元素内容,解析原创 2023-06-26 15:18:15 · 341 阅读 · 0 评论 -
6-js基础-5
对象有属性和方法组成数据描述性的信息称为属性,如人的姓名、身高、年龄、性别等,一般是名词性的。1. 定义对象属性2. 访问对象属性声明对象,并添加了若干属性后,可以使用 获得对象中属性对应的值,我称之为属性访问对象方法数据行为性的信息称为方法,如跑步、唱歌等,一般是动词性的,其本质是函数。1.定义对象方法2.调用对象方法声明对象,并添加了若干方法后,可以使用 调用对象中函数,我称之为方法调用。注:无论是属性或是方法,同一个对象中出现名称一样的,后面的会覆盖前面的。对象本质是无序的数据集合,原创 2023-06-26 13:50:53 · 258 阅读 · 0 评论 -
6-js基础-4
声明(定义)一个完整函数包括关键字、函数名、形式参数、函数体、返回值5个部分利用关键字 function 定义函数 (声明函数)< script > // 函数: 是可以被重复使用的代码块,作用是有利于代码复用 // 1. 声明(定义)了最简单的函数,既没有形式参数,也没有返回值 function sayHi() {console . log('嗨~') }函数名命名跟变量一致,采用小驼峰命名法函数名经常采用 动词。原创 2023-06-26 13:45:34 · 270 阅读 · 0 评论 -
6-js基础-3
script > // 1. 语法,使用 [] 来定义一个空数组 // 定义一个空数组,然后赋值给变量 classes // let classes = [] // 2. 定义非空数组 let classes = [ '小明' , '小刚' , '小红' , '小丽' , '小米' ] </ script >// 1. 语法,使用 [] 来定义一个空数组。原创 2023-06-26 13:40:12 · 621 阅读 · 0 评论 -
6-js基础-2
理解什么是流程控制,知道条件控制的种类并掌握其对应的语法规则,具备利用循环编写简易ATM取款机程序能力。原创 2023-06-26 13:24:54 · 292 阅读 · 0 评论 -
6-js基础-1
能说出JavaScript 是什么?怎么写?能写出JavaScript 输入和输出语句。原创 2023-06-26 13:17:02 · 228 阅读 · 0 评论 -
5-响应式
Bootstrap 是由 Twitter 公司开发维护的前端 UI 框架,它提供了大量编写好的 CSS 样式,允许开发者结合一定 HTML 结构及JavaScript,快速编写功能完善的网页及常见交互效果。原创 2023-06-26 13:11:17 · 254 阅读 · 0 评论 -
4-移动端适配-2
vh是1/100视口高度,全面屏视口高度尺寸大,如果混用可能会导致盒子变形。vw单位的尺寸 = px 单位数值 / ( 1/100 视口宽度 )vw和vh是相对单位,相对视口尺寸计算结果。原创 2023-06-26 13:02:37 · 669 阅读 · 0 评论 -
4-移动端适配-1
rem单位,是相对单位rem单位是相对于HTML标签的字号计算结果1rem = 1HTML字号大小。原创 2023-06-26 13:01:15 · 725 阅读 · 0 评论 -
3-css高级特效-2
空间:是从坐标轴角度定义的 X 、Y 和 Z 三条坐标轴构成了一个立体空间,Z 轴位置与视线方向相同。空间转换也叫 3D转换属性:transform。原创 2023-06-25 20:58:25 · 982 阅读 · 0 评论 -
3-css高级特效-1
作用:为元素添加动态效果,一般与过渡配合使用概念:改变盒子在平面内的形态(位移、旋转、缩放、倾斜)平面转换也叫 2D 转换,属性是transform。原创 2023-06-25 20:51:47 · 1085 阅读 · 0 评论 -
2-css-5
定位模式属性值是否脱标显示模式参照物相对定位relative否保持标签原有显示模式自己原来的位置absolute是行内块特点1.已经定位的祖先元素;2.浏览器可视区固定定位fiexed是行内块特点浏览器窗口。原创 2023-06-25 20:45:48 · 1090 阅读 · 0 评论 -
2-css-4
浮动属性 float,left 表示左浮动,right 表示右浮动特点浮动后的盒子顶对齐浮动后的盒子具备行内块特点父级宽度不够,浮动的子级会换行浮动后的盒子脱标清除浮动:子级浮动,父级没有高度,子级无法撑开父级高度,影响布局效果双伪元素法拓展:浮动本质作用是实现图文混排效果主要解决某个元素中内部子元素的布局方式,为布局提供的非常大的灵活性和操控性设置了display:flex的元素本身不是弹性布局它的儿子们是弹性布局。原创 2023-06-25 20:42:15 · 812 阅读 · 0 评论 -
2-css-3
作用:根据元素的结构关系查找元素。原创 2023-06-25 20:39:46 · 1893 阅读 · 0 评论 -
2-css-2
定义:由两个或多个基础选择器,通过不同的方式组合而成。作用:更准确、更高效的选择目标元素(标签)。原创 2023-06-25 20:34:11 · 4114 阅读 · 0 评论 -
2-css-1
CSS 定义:层叠样式表 (Cascading Style Sheets,缩写为 CSS),是一种样式表语言,用来描述HTML文档的呈现(美化内容)原创 2023-06-25 20:25:24 · 1046 阅读 · 0 评论 -
1-html
标签:dl 嵌套 dt 和 dd,dl 是定义列表,dt 是定义列表的标题,dd 是定义列表的描述/ 详情。< dl > < dt > 列表标题 < dd > 列表描述 / 详情 …… < dl > < dt > 列表标题 < dd > 列表描述 / 详情 …… < dt > 列表标题 < dd > 列表描述 / 详情 ……原创 2023-06-25 20:10:13 · 1687 阅读 · 0 评论