- 博客(44)
- 收藏
- 关注
RSS订阅原创 CSS定位
文章目录定位属性positionstaticrelativeabsolutefixedsticky定位属性top 定位框的顶部外边距边缘right 定位框的右侧外边距边缘bottom 定位框的底部外边距边缘left 定位框的左侧外边距边缘clip 剪裁绝对定位的元素z-index 元素的堆叠顺序可设置正或负的堆叠顺序，具有较高堆叠顺序的元素始终位于具有较低堆叠顺序的元素之前两个定位元素重叠而未指定z-index，则位于HTML代码中最后的元素将显示在顶部position 元素的
2022-05-03 14:06:19
76
原创 CSS3选择器及其优先级
文章目录选择器优先级规则分类基本选择器层次选择器伪类选择器动态伪类选择器目标伪类选择器语言伪类选择器UI元素伪类选择器结构伪类选择器否定伪类选择器伪元素属性选择器选择器优先级规则最近的祖先样式比其他祖先样式优先级高内联样式比祖先样式优先级高内联样式>ID选择器>类选择器=属性选择器=伪类选择器>标签选择器=伪元素选择器优先级计算：按abcd的顺序依次比较大小，大的优先级高，相等则比较下一个。最后都相等，按照“就近原则”判断abcd（级别）计算方式
2022-05-02 16:30:55
904
1
原创 本地存储-cookie|localStorage|sessionStorage|indexedDB
本地存储本地存储cookie如何工作问题cookie标准限制属性expires|max-agedomain&pathsecureHttpOnly设置cookie服务端设置客户端设置修改删除cookie修改cookie删除cookie跨域请求中的cookieWebStoragelocalStorage特点使用sessionStorage特点使用cookie|WebStorage的区别indexedDB使用模式本地存储cookie如何工作网页发HTTP请求时，浏览器会先检查是否有相应的cooki
2022-05-02 10:50:36
180
原创 VUE源码解析-响应式原理
响应式原理MVVM侵入式与非侵入式数据劫持/数据代理defineReactive函数递归侦测对象全部属性数组响应式依赖收集依赖Dep类和Watcher类MVVMM：模型（Model），对应data中的数据V：视图（View），模板VM：视图模型（ViewModel），Vue实例对象data中所有的属性，都会在vm上vm上所有的属性及Vue原型上所有属性，在Vue模板中都可直接使用侵入式与非侵入式数据劫持/数据代理利用JavaScript引擎赋予的功能，检测对象属性变化
2022-04-01 18:33:57
277
原创 VUE源码解析-Diff&虚拟DOM
Diff&虚拟DOMsnabbdom测试环境搭建虚拟domsnabbdom的h函数手写h函数diff算法原理手写diff算法snabbdomsnabbdom是著名的虚拟DOM库，是diff算法的鼻祖，Vue源码借鉴了snabbdom测试环境搭建搭建webpack和webpack-dev-server开发环境需按照最新版webpack@5：npm i -D webpack@5 webpack-cli@3 webpack-dev-server@3配置webpack.config.js文件
2022-03-31 19:14:00
676
2
原创 VUE源码解析-Mustache
Mustache源码解析-mastache模板引擎数据变为视图的方式简介mustache基本使用遍历数组布尔值mustache的底层核心机理最简单的模板引擎实现机理tokens手写mustache库源码解析-mastache模板引擎数据变为视图的方式1.纯dom：笨拙，没有实战价值2.数组join：本质是字符串es6的反引号法：es6中新增的${xxx}模板引擎：将数据变为视图最优雅的解决方案简介mustache是最早的模板引擎库，底层实现机理为后续模板引擎的发展提供了
2022-03-28 22:43:41
546
原创 eCharts-基础使用
EChartsECharts基础基本使用相关配置ECharts基础基本使用下载并引入echarts.js准备一个具备大小的DOM容器初始化echarts实例对象指定配置项和数据（option）将配置项设置给echarts实例对象相关配置title 标题组件tooltip 提示框组件legend 图例组件toolbox 工具栏grid 直角坐标系内绘图网格可以通过left、right、bottom、top设置网格与容器间的距离containLabel：设置是否显示刻度标签
2022-03-19 18:24:16
672
原创 前端学习笔记-vue2-UI组件库
vue2-UI组件库Vue UI 组件库移动端常用UI组件库PC端常用UI组件库Vue UI 组件库移动端常用UI组件库VantCube UIMint UIPC端常用UI组件库Element UI全局引入按需引入IView UI更多前端学习笔记
2022-01-26 13:27:53
882
原创 前端学习笔记-vue2-路由
vue2-路由路由概念vue-routerSPA路由概念路由分类基本路由嵌套（多级）路由路由传参query参数params参数命名路由路由的props配置router-link的replace属性编程式路由导航缓存路由组件路由组件独有的两个新的生命周期钩子路由守卫全局守卫独享守卫组件内守卫路由器的两种工作模式hash模式history模式路由概念vue-routervue的插件库，专门用来实现SPA应用SPA单页Web应用整个应用只有一个完整的页面点击页面的导航链接不会刷新页面，只
2022-01-26 13:24:54
417
原创 前端学习笔记-vue2-vuex
vue2-vuexvuex概念工作原理搭建vuex基本使用map方法使用模块化+命名空间配置步骤vuex概念专门在vue中实现集中式状态（数据）的一个vue插件，对vue应用中多个组件的共享状态进行集中式的管理（读/写），也是一种组件间通信的方式，且适用于任意组件间通信使用场景：多个组件依赖于同一状态来自不同组件的行为需要变更同一状态工作原理actions 响应组件中的动作mutations 操作数据state 存储数据getters 将state中的数据进行加
2022-01-26 13:22:33
780
原创 前端学习笔记-vue2-vue中的Ajax
vue2-vue中的AjaxVue中的Ajax配置代理-解决跨域问题vue常用的Ajax库slot插槽分类Vue中的Ajax配置代理-解决跨域问题1.在vue.config.js中进行配置devServer:{proxy:'跨域服务器地址'}优点：配置简单，请求资源时直接发送给前端缺点：不能配置多个代理，不能灵活控制请求是否走代理，配置请求内容不能与public内容冲突，否则不会触发代理，转发请求2.在vue.config.js中进行配置devServer:{ proxy:{
2022-01-26 13:19:57
556
原创 前端学习笔记-vue2-脚手架
vue2-脚手架Vue脚手架初始化脚手架main.js引入不同版本的Vue默认配置脚手架文件结构ref属性props配置项混合插件scoped样式todoList案例webStorage相关API备注组件的自定义事件全局事件总线安装事件总线使用事件总线销毁事件总线消息订阅与发布（pubsub）使用步骤nextTickVue封装的过渡与动画写法Vue脚手架初始化脚手架Vue脚手架是Vue官方提供的标准化开发工具（开发平台）全局安装@vue/clinpm install -g @vue/cli
2022-01-26 13:18:30
901
原创 前端学习笔记-vue2-组件
Vue2-组件组件模块与组件、模块化与组件化非单文件组件使用步骤1 定义组件2 注册组件3 使用组件VueComponentVue与VueComponent单文件组件组件模块与组件、模块化与组件化模块向外提供特定功能的js程序，一般为一个js文件作用：复用js，简化js的编写，提高js运行效率组件用来实现局部（特定）功能效果的代码集合作用：复用编码，简化项目编码，提高运行效率模块化：当应用中的js都以模块来编写时，这个应用就是一个模块化的应用组件化：当应用中的
2022-01-26 13:10:12
910
原创 前端学习笔记-Vue2-基础
Vue2-基础VUE基础VUE核心1. 简介2. 官网3. 特点4. 使用容器与实例绑定方式el的两种写法data的两种写法模板语法插值语法指令语法数据绑定MVVM模型数据代理Vue中的数据代理事件处理1. 基本使用2. 事件修饰符3. 键盘事件计算属性与监视计算属性监视深度监视计算属性与监视之间的区别class与style绑定class样式style样式条件渲染v-ifv-show列表渲染v-forkey值作用key值的选取使用index作为key值指定唯一标识作为key值列表过滤Vue监视数据原理收集表
2022-01-26 13:05:39
1004
原创 前端学习笔记-Git
Git版本控制主流版本控制器分类Git基本理论基本的Linux命令工作区域工作流程忽略文件规则版本控制管理多人协同开发项目的技术，对版本迭代进行管理。实现跨区域多人协同开发追踪和记载一个或多个文件的历史记录组织、保护源代码及文档统计工作量并行开发，提高开发效率跟踪记录整个软件的开发过程减轻开发人员负担，节省时间，降低人为错误主流版本控制器GitSVNCVSVSSTFS分类本地版本控制集中版本控制（SVN）分布式版本控制（Git）Git基本理论基本的L
2022-01-03 21:19:26
158
原创 前端学习笔记-CSS扩展语言（LESS SCSS）
CSS扩展语言LESS安装变量嵌套规则混合运算继承less避免编译SCSS数据类型运算1. 数字运算符2. 关系运算符3. 相等运算符4. 布尔运算符5. 颜色值运算6. 运算优先级嵌套语法其他语法rules与指令控制指令LESS安装1.Node.jsnpm install -g lesslessc styles.less styles.css2.浏览器环境中引用<link rel=“stylesheet/less” type=“text/css” href=“styles.les
2022-01-03 21:15:09
701
原创 前端学习笔记-AJAX
AJAXAJAX原生AJAXAJAX简介XML简介Ajax特点HTTP请求报文响应报文Ajax请求步骤get请求post请求服务端响应JSON数据nodemon解决ie缓存问题请求超时与网络异常取消请求避免重复请求（节流阀）jQuery中的Ajax1.get请求2.post请求3.通用方法Ajax常用参数axios发送Ajax1.特点2.get请求3.post请求4.通用Ajax请求fetch发送Ajax跨域同源策略解决跨域JSONPCORS(跨域资源共享)AJAX原生AJAXAJAX简介Ajax全
2022-01-03 21:10:42
412
原创 Node.js-1-基础
基础概述JavaScript（浏览器vsNode.js）浏览器中的JavaScriptNode.js中的JavaScript特性核心模块fs文件读写文件读取文件写入processhttpHTTP服务器模块化概述Node.js是JavaScript运行时的环境，可以解析和执行JavaScript代码，使得JavaScript可以脱离浏览器进行运行，是构建于Chrome的V8引擎之上的JavaScript（浏览器vsNode.js）浏览器中的JavaScriptECMAScript语法BOM
2021-10-22 18:49:59
45
原创 VUE-1-模板语法
VUE-模板语法插值操作简单赋值赋值指令绑定属性v-bind作用语法糖-缩写基本使用动态绑定class计算属性事件监听条件判断循环遍历阶段案例v-model插值操作简单赋值 <div id='demo'> <h1>{{greet}}</h1> <h2>{{firstName}} {{lastName}}</h2> <h2>{{firstName + ' ' + lastName}}&
2021-10-21 11:16:36
96
原创 JavaScript-13-移动端特效
移动端特效移动端触屏事件概述触屏事件触摸事件对象移动端拖动元素常见的移动端特效classList属性移动端开发插件移动端开发框架移动端触屏事件概述touch对象代表一个触摸点，触屏事件可响应触摸点触发的操作触屏事件touchstart 手指触摸到一个DOM元素时触发touchmove 手指在一个DOM元素上滑动时触发touchend 手指从一个DOM元素上移开时触发 divLeft.addEventListener('touchstart', function() {
2021-10-03 18:04:19
112
原创 JavaScript-12-PC端网页特效
PC端网页特效元素偏移量offset系列概述常用属性offset与style元素可视区client系列元素滚动scroll系列封装简单动画函数常见的网页特效元素偏移量offset系列概述获得元素距离带有定位父元素的位置获得元素自身的大小（宽度、高度）返回的数值不带单位常用属性element.offsetParent 返回作为该元素带有定位的父级元素，如果父级都没有定位则返回body注：offsetParent 返回带有定位的父级元素parentNode 返回最近一级的父级元素
2021-10-02 14:57:14
123
原创 JavaScript-11-BOM
BOM概述DOM与BOMBOM的构成顶级对象windowwindow对象的常见事件document对象location对象navigator对象history对象定时器函数JS执行机制概述BOM是浏览器对象模型，提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是window。BOM由一系列相关的对象构成，并且每个对象都提供了很多方法和属性DOM与BOMDOMBOM定义文档对象模型浏览器对象模型针对对象文档浏览器顶级对象documentwindow
2021-09-14 20:27:00
67
原创 JavaScript-10-事件高级
事件高级元素注册事件的方式传统方式方法监听注册*注册事件兼容性问题解决方案删除事件的两种方式传统注册事件方法监听注册事件* 删除事件兼容性问题解决方案DOM事件流的三个阶段定义步骤事件对象含义常见属性和方法封装阻止冒泡的兼容性函数事件委托的原理常用的鼠标事件常用的键盘事件欢迎使用Markdown编辑器元素注册事件的方式给元素添加事件，称为注册事件或绑定事件传统方式利用on开头的事件 如onclick<标签 οnclick=“alert(hi~)”></标签>事件源.on
2021-09-09 22:30:43
67
原创 JavaScript-算法-两数相加
目录两数相加两数相加两数相加两数相加1. 问题描述给你两个 非空 的链表，表示两个非负的整数。它们每位数字都是按照 逆序 的方式存储的，并且每个节点只能存储 一位 数字。请你将两个数相加，并以相同形式返回一个表示和的链表。你可以假设除了数字 0 之外，这两个数都不会以 0 开头。来源：力扣（LeetCode）链接：https://leetcode-cn.com/problems/add-two-numbers2. 解题思路定义头尾指针遍历两个链表两数之和为两个值相加再加上进位值将
2021-09-09 16:28:20
1188
原创 TCP/IP-ARP
TCP/IP-ARPARP解析过程新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入ARP解析过程Created with Raphaël 2.3.0开始用户输入域名，回车DNS解析，将域名解析为IP地址客户端请求TCP,
2021-09-09 16:26:00
60
原创 JavaScript-9-DOM核心
DOM简介DOM树获取元素根据ID获取根据标签名获取通过HTML5新增的方法获取特殊元素获取（body html）事件基础事件组成执行事件的步骤操作元素改变元素内容改变元素属性修改表单属性改变样式属性排他思想节点操作简介DOM文档对象模型，是W3C组织推荐的处理可扩展标记语言（HTML或XML）的标准编程接口。通过DOM接口可以改变页面的内容、样式和结构DOM树文档：一个页面就是一个文档，DOM中使用document表示元素：页面中的所有标签都是元素，DOM中使用element表示节点：网页
2021-09-06 21:13:17
75
原创 JavaScript-8-作用域
文章目录含义概念分类（es6之前）变量的作用域分类区别作用域链含义概念代码名字（变量）在某个范围内起作用和效果目的：提高程序的可靠性，减少命名冲突分类（es6之前）全局作用域：整个script标签或者是一个单独的js文件局部作用域（函数作用域）：在函数内部起效果和作用块级作用域（es6）：{} 如if(){} for(){}let 只在语句块内起效果和作用变量的作用域分类全局变量：在全局作用域下的变量（特别地：在函数内部没有声明直接赋值的变量，也是全局变量）局部变量：在局
2021-08-19 18:12:53
49
原创 JavaScript-7-函数
函数含义声明/调用函数arguments的使用伪数组使用含义函数就是封装了一段可以被重复使用的代码段声明/调用函数利用函数关键字自定义函数（命名函数）function fn(){}–声明fn();–调用函数表达式（匿名函数）var 变量名 = function(){};–声明变量名();–调用arguments的使用存储函数所有的实参注：只有函数才有arguments对象，每个函数都内置好了arguments伪数组具有数组的length属性按照索引的方式进行存储没有真正
2021-08-19 14:53:18
35
原创 JavaScript-6-对象
对象概念创建方法对象字面量创建对象{}new Object创建对象构造函数创建对象变量和属性函数和方法构造函数和对象new 关键字执行过程遍历对象内置对象含义使用Math对象日期对象数组对象字符串对象概念含义：在JavaScript中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象属性：事物的特征，在对象中用属性表示方法：事物的行为，在对象中用方法表示自定义对象、内置对象属于ECMAScript；浏览器对象属于JS独有创建方法对象字面量创建对象{}属性或方法采取键值对的形式，多
2021-08-19 14:38:38
131
原创 JavaScript-算法-和（积）为k的子数组
目录和（积）为k的子数组和为k的子数组和（积）为k的子数组和为k的子数组1. 问题描述给定一个整数数组和一个整数 k，你需要找到该数组中和为 k 的连续的子数组的个数。2.解题思路一暴力破解,双重for循环若和等于k，计数+1 var subarraySum = function(nums, k) { var count = 0; for(var i = 0; i < nums.length; i++){ let sum = 0;
2021-05-21 16:12:24
351
1
原创 JavaScript-4-循环
目录循环目的while循环和do while循环的区别break和continue区别循环for循环：重复执行某些代码，通常与计数相关语法结构for(初始化变量; 条件表达式; 操作表达式){循环体}初始化变量 通常作计数器用条件表达式，决定每一次循环是否继续执行，即终止条件操作表达式，每次循环最后执行的代码，对计数器变量进行更新执行过程（1）初始化变量；（2）条件表达式，满足条件执行循环体，否则退出循环；（3）操作表达式；（4）继续执行（2）。while循环do
2021-05-20 12:21:08
100
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人