YuLong的博客

文章目录路由的理解前端路由hash模式history模式路由的理解路由：一个路由就是一个映射关系(key:value)key为 路径，value可能是 function 或 component路由分类：后端路由：理解： value是 function，用来处理客户端提交的请求。注册路由： router.get(path, function(req, res))工作过程：当node接收到一个请求时，根据请求路径找到匹配的路由，调用路由中的函数来处理请求，返回响应数据前端路由：

文章目录React ajax前置说明常用ajax请求库axios消息订阅-发布机制Fetch案例——github用户搜索React ajax前置说明React 本身只关注于界面, 并不包含发送ajax请求的代码前端应用需要通过ajax请求与后台进行交互(json数据)react 应用中需要集成第三方ajax库(或自己封装)常用ajax请求库1、jQuery: 比较重, 如果需要另外引入不建议使用2、axios: 轻量级, 建议使用封装XmlHttpRequest对象的ajaxpr

文章目录React脚手架脚手架创建项目并启动项目结构功能界面的组件化编码流程（通用）React脚手架脚手架用来帮助程序员快速创建一个基于xxx库的模板项目包含了所有需要的配置（语法检查、jsx编译、devServer…）下载好了所有相关的依赖可以直接运行一个简单效果React提供了一个用于创建React项目的脚手架库: create-react-app项目的整体技术架构为: react + webpack + es6 + eslint使用脚手架开发的项目的特点: 模块化, 组件化,

文章目录PC端网页特效偏移量系列 offset可视区系列 client滚动系列 scrollPC端网页特效偏移量系列 offsetoffset 翻译过来就是偏移量， 使用 offset 系列相关属性可以 动态 的得到该元素的位置（偏移）、大小等。获得元素距离带有定位父元素的位置获得元素自身的大小（宽度高度）注意： 返回的数值都不带单位常用属性：图示：offset与style区别：offsetstyle可以得到任意样式表中的样式值只能得到行内样式表中的样式值

文章目录BootstrapBootstrapBootstrap 是一款非常优秀的Web前端框架，其灵活性和可扩展性加速了响应式页面开发的进程。Bootstrap遵循移动优先的原则，在开源之后迅速受到开发人员的追捧，推动了响应式技术的发展Bootstrap 来自 Twitter（推特），是目前最受欢迎的前端框架之一。是一个基于 HTML、CSS和JavaScript 语言编写的框架，具有简单、灵活的特性，拥有样式库、组件和插件Bootstrap常用来 开发响应式布局和移动设备优先的Web项目，能够

文章目录移动端Web开发流式布局flex布局布局原理常用属性rem布局rem基础媒体查询less移动端Web开发流式布局在PC端进行网页制作时，经常使用固定像素的网页布局，但这种布局方式对小屏幕的设备不友好。为了适应小屏幕的设备，在移动设备和跨平台（响应式）网页开发过程中，多数使用流式布局。流式布局是一种等比例缩放布局方式，在CSS代码中使用百分比来设置宽度，所以也称百分比自适应布局。流式布局实现方法是，将CSS固定像素宽度换算为百分比宽度，其换算公式如下：目标元素宽度 / 父盒子宽度 = 百分数

文章目录移动端Web开发移动端基础浏览器视口样式编写分辨率和设备像素比二倍图SVG矢量图移动端Web开发移动Web开发的两种主流方案，一种是单独制作移动端页面，另一种是制作响应式页面移动端页面：单独制作移动端页面的优势和劣势：单独制作移动端页面，通常的做法是不改变原有的PC端页面，然后针对移动端单独开发出一套特定的版本。如果是移动设备（iPhone 6/7/8 Plus），则跳转到移动端页面如果是PC端设备，则跳转到PC端页面响应式页面：响应式页面指的是同一页面在不同屏幕尺寸下实现

文章目录

文章目录duff算法key的作用index和id作为key的区别duff算法key的作用问题：react中的 key 有什么作用？（key的内部原理是什么？）虚拟DOM中key的作用：简单的说: key是虚拟DOM对象的标识, 在更新显示时key起着极其重要的作用详细的说: 当状态中的数据发生变化时，react会根据【新数据】生成【新的虚拟DOM】，随后React进行 【新虚拟DOM】与【旧虚拟DOM】的diff比较，比较规则如下：1、 旧虚拟DOM中找到与新虚拟DOM相同的key：

文章目录生命周期旧生命周期新生命周期生命周期示例——时钟生命周期组件从创建到死亡它会经历一些特定的阶段。React组件中包含一系列钩子函数(生命周期回调函数), 会在特定的时刻调用。在定义组件时，会在特定的生命周期回调函数中，做特定的工作旧生命周期生命周期的三个阶段（旧）三个阶段：初始化阶段: 由 ReactDOM.render() 触发——初次渲染constructor()componentWillMount()render() =====> 必须使用的一个comp

文章目录事件处理收集表单数据非受控组件受控组件函数柯里化事件处理在React中获取虚拟组件中的标签的值使用组件的 refs属性在虚拟组件的标签中定义事件，在事件中通过 箭头函数 获取标签的值使用事件对象——event事件处理：通过onXxx属性指定事件处理函数(注意大小写)React使用的是自定义(合成)事件, 而不是使用的原生DOM事件 ———为了更好的兼容性React中的事件是通过事件委托方式处理的(委托给组件最外层的元素) ————为了高效通过event.targe

文章目录React 三大属性state 属性props 属性refs 属性React 三大属性state 属性在React框架中定义了一个状态(State) 概念， 并通过状态(State)来实现React组件的状态机特性。“状态机” 特性： 就是指 组件通过与用户的交互， 更新实现不同的状态，通过渲染UI保证用户界面和数据一致性 (不需要操作DOM)应用场景：组件的内容需要根据数据的刷新而刷新创建方法： 在类的构造函数中定义this.state={ 属性名：属性值 …}t

文章目录组件与模块概念React 组件介绍组件与模块概念模块：理解：向外提供特定功能的js程序, 一般就是一个js文件为什么要拆成模块：随着业务逻辑增加，代码越来越多且复杂。作用：复用js, 简化js的编写, 提高js运行效率组件：理解：用来实现局部功能效果的代码和资源的集合(html/css/js/image等等)为什么要用组件： 一个界面的功能更复杂作用：复用编码, 简化项目编码, 提高运行效率模块化： 当应用的js都以模块来编写的, 这个应用就是一个模块化的应用组件化：

文章目录二叉树二叉树树 ： 是n（n>=0)个结点的非线性表结构，n=0时称为空树。在任意一棵非空树中：有且仅有一个根结点当n>1时，其余结点可分为m（m>0)个互不相交的有限集T1,T2,…,Tm, 其中每一个集合本身又是一棵树，被称为根的子树二叉树： 每个节点最多只有2个子节点的树，这两个节点分别是左子节点和右子节点满二叉树： 有一种二叉树，叶子全部在最底层，除了叶子节点外，每个节点都有左右两个子节点完全二叉树： 有一种二叉树，叶子节点都在最底下两层，最后一层叶

文章目录React 简介React 概述及特点React 渲染机制JSX 语法React 简介React 概述及特点是一个用于构建用户界面，将数据渲染为HTML视图的开源 JavaScript库中文官网：React官方中文文档是 Facebook 开发并于2013年发布并宣布开源基于 JSX 的语法，JSX是React的核心组成部分，它使用xml标记的方式去直接声明界面，和html、js混写React核心是 组件，组件的设计提高了代码的复用率，降低了测试的难度和代码复杂度。组件将数据和逻

文章目录

文章目录

文章目录Express 框架简介原生Node.js与Express框架对比Express 中间件Express 请求处理Express 框架详细信息Express 项目结构分析app.js 文件配置详解express-art-template 模板引擎Express 框架简介Express 是一个最小的，灵活的 Node.js Web应用程序框架，它提供了一套强大的功能来开发Web和移动应用程序。 它有助于基于Node Web应用程序的快速开发。核心功能：定义了用于执行基于HTTP方法和URL

文章目录ORM框架Sequelize模块的使用Sequelize的增删改查Sequelize的多表关联ORM框架Sequelize模块的使用Sequelize的增删改查Sequelize的多表关联

文章目录操作MySQL数据库数据库连接池操作操作MySQL数据库数据库连接池操作

文章目录Web基础知识Web基础知识Web服务器：又称为网站服务器，主要用于提供网上信息浏览服务常见的Web服务器软件有Apache HTTP Server（简称Apache）、Nginx等，Node内置有web服务器在Web服务器中，请求资源又分为静态资源和动态资源：静态资源：只要服务器没有修改这些文件，客户端每次请求到的都是同样的内容。动态资源：是内容可以动态发生变化，每次请求都需要计算处理。Http协议： 超文本传输协议，用于规范客户端和服务器之间以指定的格式进行数据交互。是一

文章目录Promise对象回调函数及异步任务回调地狱Promise的使用async/await函数Promise对象回调函数及异步任务回调地狱Promise的使用async/await函数

文章目录234. 回文链表234. 回文链表原题链接：234. 回文链表

文章目录栈队列栈 和 队列 是两种重要的线性结构，从数据结构的角度看，栈和队列也是 线性表，其特殊性在于栈和队列的基本操作是线性表的子集。它们是操作受限的线性表，因此，可称为限定性的数据结构。但从数据类型角度看，它们是和线性表大不相同的两类重要的的抽象数据类型。栈所有的插入和删除操作都限制在线性表的 同一端 进行，是一种 后进先出 的线性表表尾端称栈顶，表头端称栈底ES5的写法：//定义栈的构造函数function Stack(){ // 用数组来模拟栈 let

文章目录TCP服务器与客户端TCP基础net模块创建TCP服务器和客户端UDP服务器与客户端UDP基础dgram模块创建UDP服务器和客户端HTTP服务器与客户端HTTP基础http模块创建HTTP服务器和客户端TCP服务器与客户端TCP基础Tcp协议：传输控制协议，提供面向连接的、可靠的数据传输服务面向连接：数据传输之前，客户端与服务器要建立连接可靠的：数据的传输是有序的、要对数据进行校验TCP数据分组称为段（Segment）。TCP将来自应用层的数据进行分块并封装成TCP段进行发送

文章目录HTTP服务器与客户端（重要）HTTP基础http模块创建HTTP服务器和客户端GET请求和POST请求HTTP服务器与客户端（重要）HTTP基础HTTP协议： 超文本传输控制协议 ，通用的、无状态的、与传输数据无关的协议（工作在应用层）服务器与客户端进行交互的过程：客户端与服务器建立TCP连接（HTTP协议是基于TCP协议实现的）客户端向服务器发送请求服务器向客户端返回响应信息关闭HTTP连接报文：在HTTP请求和响应的过程中传递的数据块就叫报文，包括要传送的数据和一些

文章目录文件系统文件系统基础fs 模块同步、异步文件操作文件路径文件系统文件系统基础fs 模块fs模块提供一组文件操作API用于模仿标准POSIX函数与文件系统进行交互。导入该模块：const fs = require('fs');fs模块共有5个类：fs.Dirent（指示文件类型）fs.FSWatcher（监视文件）fs.ReadStream（读取流）fs.WriteStream（写入流）fs.Stats（文件的信息）名称具有 ‘Sync’ 后缀的方法为同步方法，不具有该后

文章目录全局对象全局属性全局对象Buffer对象Buffer实例对象用法流可读流可写流管道读写操作全局对象全局属性__filename 指向当前正在执行的脚本文件名__dirname 指向当前运行的脚本所在的目录(路径)全局对象console实例对象: console.log("字符串")：输出到标准终端 console.error()：输出错误信息 (2)process：进程对象 A、process.stdout：输出对象，该对象下

文章目录Node.js模块系统Node.js核心模块os 模块util 模块path 模块url 模块querystring 模块Node.js包JavaScript开发弊端： JavaScript在使用时存在两大问题，文件依赖 和 命名冲突软件中的模块开发：一个功能就是一个模块，多个模块可以组成完整应用，抽离一个模块不会影响其他功能的运行Node.js模块系统Node.js规定一个 JavaScript文件 就是一个模块，模块内部定义的变量和函数默认情况下在外部无法得到模块内部可以使用exp

文章目录Node.jsNode特点Node.jsNode.js简称Node，是一个可以使JavaScript运行在服务器端的开发平台JavaScript本是一种Web前端语言，Node.js让JavaScript成为服务器端脚本语言Node.js选择JavaScript作为实现语言的原因：JavaScript满足CommonJS标准，符合事件驱动，用户较多且门槛较低；Chrome的V8引擎具有出色的性能。Node.js将V8引擎封装起来，作为服务器运行平台，以执行 JavasScrip

文章目录关系型数据库设计范式第一范式1NF第二范式2NF第三范式3NF逆规范化总结关系型数据库设计范式范式：Normal Format，符合某一种级别的关系模式的集合，表示一个关系内部各属性之间的联系的合理化程度范式是离散数学里的概念，是一种数学理论范式目标是在满足组织和存储的前提下使数据结构冗余最小化 ，减少数据冗余范式级别越高，即满足的范式越多，表的级别就越标准，越符合高标准表设计目前数据库应用到的范式有以下几层：第一范式：1NF第二范式：2NF第三范式：3NF逆规

文章目录一、外键约束二、事务安全三、预处理四、视图五、数据备份与还原1、表数据备份、还原2、文件备份、还原3、SQL备份、SQL还原六、用户管理1、账号管理2、权限管理3、角色管理安全管理：用各种方式来确保数据库的安全和数据的安全1、安全管理是每一个接触数据库的人都应该考虑的问题，尤其是DBA（数据库管理员）2、数据库安全的维度有很多管理安全：用户、权限、备份还原等结构安全：外键、视图、事务等执行层：预处理一、外键约束外键：foreign key，表中指向外部表主键的字段定义成外键外

文章目录数据新增1、批量插入2、蠕虫复制3、主键冲突数据查询1、查询选项 distinct2、字段选择&别名 as3、数据源 from4、where子句5、group by子句6、having子句7、order by子句8、limit子句数据更新1、限制更新数据删除1、限制删除2、清空数据数据新增1、批量插入批量插入：是一种优化数据逐条插入的方式批量插入数据的语法与简单数据插入的语法差不多批量插入分为两种：全字段批量插入： insert into 表名 values(值列表1)

文章目录表关系一对一关系一对多关系多对多关系总结表关系表关系：一个表代表一个实体，实体之间都有关联关系的根据 范式的要求 来设计表关系，减少数据冗余根据 实际需求 来设计表关系，提升访问效率1、表关系是体现数据实际联系的方式2、表关系的设计好坏直接关联数据维护的准确性、有效性3、良好的数据库设计有助于后期程序开发一对一关系一对多关系（多对一）多对多关系一对一关系一对一关系：一张表中的一条记录与另外一张表中有且仅有一条记录有关系一对一关系通常是用来将一张原本就是一体的表拆分

文章目录字符集字符集概念MySQL字符集乱码问题解决字符集设置原理总结校对集校对集概念校对集设置校对集应用总结字符集目标：了解字符集的概念，掌握MySQL数据库存储数据的字符集逻辑以及设置方式字符集概念MySQL字符集关系解决乱码问题字符集设置原理字符集概念字符集：charset或者character set，是各种文字和符号在计算机中的总称字符集根据不同国家的符号不同，有不同的字符集不同的字符集占用的存储空间不一样，存储的底层也不一样不同字符集之间可以进行转换常见字符集

文章目录字段类型1、字段类型作用2、整数类型3、显示宽度4、小数类型（浮点型）5、小数类型（定点型）6、字符串类型（定长型）7、字符串类型（变长型）8、字符串类型（文本字符串）9、字符串类型（枚举）10、字符串类型（集合）11、时间日期类型（年）12、时间日期类型（时间戳）13、时间日期类型（日期）14、时间日期类型（日期时间）15、时间日期类型（时间）16、总结二、属性1、属性作用2、NULL属性3、Default属性4、主键5、主键管理6、自增长属性7、自增长管理8、唯一键9、唯一键管理10、comme

文章目录SQL基本介绍8、总结SQL基本介绍SQL （Structured Query Language）：结构化查询语言，是一种针对关系型数据库特殊标准化的编程语言SQL是一种编程语言能够实现用户数据库查询和程序设计SQL根据操作不同，分为几类DQL： Data Query Language，数据查询语言，用于查询和检索数据DML： Data Manipulation Language，数据操作语言，用于数据的写操作（增删改）TPL：Transaction Process L

文章目录MySQL介绍MySQL简介MySQL访问MySQL基本操作命令MySQL介绍MySQL简介MySQL：是瑞典AB公司下的一款关系型数据库MySQL当前属于甲骨文公司（AB->Sun->Oracle）MySQL开源免费（部分存储引擎）MySQL是一种C/S结构软件，因此需要MySQL的客户端来访问服务端（数据管理）mysqld.exe：服务端mysql.exe：客户端MySQL使用SQL指令对数据库进行操作#mermaid-svg-1KyCR8GnBf41S

文章目录数据库基本概念（四个）数据库系统（DBS）DBS的组成DBS的特点数据库管理系统（DBMS）DBMS的组成DBMS的功能数据库系统的内部体系结构外部体系结构数据库模式数据库的三级系统结构数据库的二级映像概念模型常见的数据模型（三种）关系模型相关概念关系模型的完整性约束关系代数数据库其它知识点索引视图事务数据库基本概念（四个）数据(Data)：描述事物的符号记录。数据库(DataBase，DB)：是长期存储在计算机内的、有组织的、可共享的、统一管理的相关数据的集合。数据库管理系统(DataBa

文章目录jQuery事件事件注册事件处理on() 绑定事件off() 解绑事件trigger() 自动触发事件事件对象jQuery其他方法jQuery对象拷贝多库共存jQuery插件jQuery事件事件注册语法：element.事件(function(){})$('div').click(function(){ 事件处理程序 }) 其他事件和原生基本一致。比如mouseover、mouseout、blur、focus、change、keydown、keyup、resize、scroll 等

文章目录jQuery样式操作操作CSS方法设置样式类方法jQuery属性操作jQuery元素操作jQuery样式操作操作CSS方法1、获取样式属性的值$(selector).css('样式属性名')2、设置样式属性的值对象方式：属性名和属性值用冒号隔开， 属性可以不用加引号$(selector).css({'样式属性' : '值'})3、函数传值方式：属性必须加引号，值如果是数字可以不用跟单位和引号$(selector).css('样式属性','值')设置样式类方法作用等同于以前的

文章目录jQuery概述jQuery对象与DOM对象区别、转换jQuery概述jQuery对象jQuery对象：通过jquery的方式获取到的对象DOM对象：通过js的方法获取到的对象与DOM对象区别、转换jquery对象是一个DOM对象的包装集（包含了DOM对象的集合）jquery对象实质是一个DOM对象的伪数组DOM对象不能调用jquery对象的方法jQuery对象能不能调用DOM对象的方法转换：DOM对象转换成jquery对象var $obj = $(domObj);

文章目录正则表达式使用组成可选模式符边界符字符类量词符预定义类优先级String类中方法match()方法search()方法split()方法replace()方法正则表达式一种描述字符串结构的语法规则，是用于匹配字符串中字符组合的模式，同时正则表达式也是对象特点：具有灵活性逻辑性和功能性非常强可以迅速地用极简单的方式达到字符串的复杂控制使用创建：字面量方式：var 变量名=/表达式/构造函数方式：var 变量名=new RegExp(/表达式/)test( )方法用来检测字

文章目录BOMwdinow对象window对象常见事件定时器JS执行机制其他对象location对象navigator对象history对象BOMBOM（Browser Object Model） 浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是 windowBOM 由一系列相关的对象构成，并且每个对象都提供了很多方法与属性wdinow对象是 JS 访问浏览器窗口的一个接口是一个全局对象。定义在全局作用域中的变量、函数都会变成 window 对象的属性和方法w

文章目录参考之前所写文章：JavaScript 实现单向链表的操作JavaScript实现双向链表 ：使用ES6面向对象语法双向链表： 每个结点都有一个指向其前一个结点的指针域(prev)和一个指向其下一个结点的指针域(next)与单链表区别：单链表是单向的，有一个头结点，一个尾结点，要访问任何结点，都必须知道头结点，不能逆着进行双向链表基于单链表。双链表添加了一个指针域，通过两个指针域，分别指向结点的前结点和后结点。可以通过双链表的任何结点，访问到它的前结点和后结点链表的设计：一个是 N

文章目录事件事件注册传统方式事件监听方式事件删除DOM事件流事件对象事件对象的使用常用属性和方法e.target和this区别阻止默认行为阻止事件冒泡事件委托鼠标事件鼠标事件对象键盘事件键盘事件对象综合案例：快递单号放大显示事件事件注册传统方式dom对象.事件名=事件处理程序唯一性：同一个对象的同一个事件只能注册一个处理程序，后面注册的程序会将前面注册的程序覆盖掉事件监听方式由于不同浏览器采用的事件流实现方式不同，事件监听的实现存在兼容性问题。通常根据浏览器的内核，可以把浏览器划分为两大类①

文章目录面试题 02.01. 移除重复节点83. 删除排序链表中的重复元素面试题 02.01. 移除重复节点原题链接：面试题 02.01. 移除重复节点/** * Definition for singly-linked list. * function ListNode(val) { * this.val = val; * this.next = null; * } *//** * @param {ListNode} head * @return {ListNod

文章目录206 反转链表（简单）206 反转链表（简单）解题思路：①双指针迭代法先存储当前结点的下一个结点把当前结点取出，指向上一个结点更换下一个结点继续迭代/** * Definition for singly-linked list. * function ListNode(val, next) { * this.val = (val===undefined ? 0 : val) * this.next = (next===undefined ? null :

文章目录案例：显示隐藏密码案例案例：循环精灵图案例：密码框验证信息案例：背景换色案例：表格换色案例：表单全选和反选案例：tab栏切换案例：显示隐藏密码案例核心思路： (操作表单元素属性)点击眼睛按钮，把密码框类型改为文本框就可以看见里面的密码 一个按钮两个状态，点击一次，切换为文本框，继续点击一次切换为密码框算法：利用一个flag变量，来判断flag的值，如果是1 就切换为文本框，flag 设置为0，如果是0 就切换为密码框，flag设置为1<style> .box{

文章目录节点基础节点分类节点层级获取节点获取父节点获取子节点获取兄弟节点节点操作创建节点添加节点删除节点复制节点节点基础节点分类HTML文档可以看作是一个节点树，网页中的所有内容都是节点，一般来说，节点至少拥有nodeType（节点类型）、nodeName（节点名称）和nodeValue（节点值）这3个基本属性元素节点，nodeType为1 （节点操作主要操作的是元素节点）属性节点，nodeType为2文本节点，nodeType为3，文本节点包含文字、空格、换行等节点层级节点的层级关系如

文章目录WebAPIDOMDOM树DOM获取元素方式document对象属性事件事件的使用步骤事件的类型操作元素操作元素内容操作元素属性案例：显示隐藏密码案例操作元素样式案例：循环精灵图案例：密码框验证信息WebAPIAPI：应用程序编程接口，是一些预先定义的函数，由某个软件开放给开发人员使用的，帮助开发者实现某种功能，开发人员无须访问源码、无须理解其内部工作机制细节，只需知道如何使用即可简单理解： API 是给程序员提供的一种工具，以便能更轻松的实现想要完成的功能WebAPI：主要针对浏览器的A

文章目录ES5新增方法数组方法字符串方法对象方法类的本质ES5新增方法ES5 中给我们新增了一些方法，可以很方便的操作数组或者字符串，这些方法主要包括数组方法迭代(遍历)方法：forEach()、map()、filter()、some()、every()array.forEach(function(currentValue, index, arr))foreach() 方法：currentValue：数组当前项的值index：数组当前项的索引arr：数组对象本身array.filt

JavaScript实现链表 ：使用ES6面向对象语法链表： 数据的一种存储结构，一个链表包含若干个结点，每个结点至少包含一个数据域和一个指针域，指针域指向下一个结点链表的分类：单向链表：每个结点都只有一个指向其下一个结点的指针域(next)双向链表：每个结点都有一个指向其前一个结点的指针域(prev)和一个指向其下一个结点的指针域(next)头指针、头结点、首元结点的区别：头结点： 在单链表第一个元素结点之前设置的一个结点， 数据域可以不存任何信息，指针域指向单链表第一个元素的结点。头

文章目录this指向分析this指向更改this指向错误处理try catch处理throw抛出错误对象错误类型继承构造函数实现继承父类属性原型对象实现继承父类方法this指向函数中this指向，情况如下：构造函数内部的this指向新创建的对象直接通过函数名调用函数时，this指向的是全局对象window如果将函数作为对象的方法调用，this将会指向该对象分析this指向function foo(){ return this}var o={ name:'Jim',

文章目录HTML5新特性新增语义化标签新增多媒体标签视频标签音频标签多媒体标签总结新增input类型新增表单属性CSS3新特性属性选择器结构伪类选择器伪元素选择器HTML5新特性HTML5 的新增特性主要是针对于以前的不足，增加了一些新的标签、新的表单和新的表单属性等这些新特性都有兼容性问题，基本是 IE9+ 以上版本的浏览器才支持，如果不考虑兼容性问题，可以大量使用这些新特性新增语义化标签<header>：头部标签<nav>：导航标签<article>：

文章目录作用域变量的作用域作用域链闭包函数预解析作用域变量的作用域全局变量：在函数外部定义的变量（显示定义）或在内部不用var定义的变量（隐式定义） 在浏览器页面关闭后才销毁，比较占空间局部变量：在函数内部利用var关键字定义的变量 函数调用结束后就销毁，节省内存资源块级变量：ES6中使用let关键字在语句块中定义的变量 当语句块结束就销毁，更节省内存空间作用域链在一个函数内部声明另一个函数时，内层函数只能在外层函数作用域内执行，在内层函数执行过程中，若引入某个变量，先在当前作用

文章目录原型对象构造函数的原型对象对象的原型对象原型对象的原型对象原型链原型链结构图函数在原型链中的结构原型对象构造函数的原型对象每个构造函数都有一个原型对象存在，这个原型对象通过构造函数的prototype属性来访问，属性指向了构造函数的原型对象//构造函数的原型对象function Person() {} // 定义函数console.log(Person.prototype) // 输出结果：{constructor: ƒ}console.log(typeof Person.protot

文章目录面向对象ES6面向对象语法类和对象构造函数成员函数继承静态成员、实例成员静态属性的定义静态方法的定义面向对象面向对象就是把需要解决的问题分解成一个个对象，建立对象不是为了实现一个步骤，而是为了描述每个对象在解决问题中的行为，面向对象的核心是对象。面向对象的优势：模块化更深，封装性强更容易实现复杂的业务逻辑更容易维护、复用、扩展面向对象的特征：封装性：对象是属性和行为的结合体多态性：同一消息被不同对象接收后，会产生不同的效果继承性：子类型可继承父类的信息ES6面向对象语法

文章目录猜数字游戏倒计时算法的实现统计字符串中每个字母出现的次数将十进制的整数转换成给定数制格式输出猜数字游戏使程序随机生成一个1~10之间的数字，并让用户输入一个数字，判断这两个数的大小，如果用户输入的数字大于随机数，那么提示“你猜大了”，如果用户输入的数字小于随机数，则提示“你猜小了”，如果两个数字相等，就提示“恭喜你，猜对了”，结束程序。function getRandom(min, max) { return Math.floor(Math.random() * (max - min

文章目录对象什么是对象对象定义和成员的访问利用字面量创建非空对象用new Object创建空对象用构造函数创建对象对象成员的访问遍历对象成员内置对象Math对象Date对象数组对象String对象值类型和引用类型对象什么是对象在JavaScript中，对象是一种数据类型，它是由属性和方法组成的一个集合。属性是指事物的特征（静态），方法是指事物的行为（动态）对象定义和成员的访问利用字面量创建非空对象var 对象名={ 属性名：值 方法名：function([参数]){ 方法体语句 }

文章目录函数定义函数调用函数函数的参数函数的返回值函数的内置对象arguments函数练习题计算n！求数组中的最大值数组排序找出100以内素数将字符串中的空格替换函数的进阶函数表达式（匿名函数）回调函数递归函数递归计算输入的n！递归计算1+2+3+...n递归输出斐波那契数列前20项作用域变量的作用域作用域链闭包函数预解析函数在编写代码时，可能会出现非常多的相同代码，或者功能类似的代码，这些代码可能需要大量重复使用，此时就可以使用JavaScript中的函数。定义函数function 函数名（[参数

文章目录排序算法冒泡排序选择排序查找算法顺序查找二分法查找（折半查找）排序算法冒泡排序数组元素依次进行两两比较，若两个元素存在大小关系就进行交换，直到数组有序//冒泡排序var arr=[10,7,5,31,98,27]console.log(arr)//升序for(var i=0;i<arr.length;i++){ //控制排序趟数 for(var j=0;j<arr.length-1;j++){ //控制比较次数 if (arr[j]>arr[

文章目录数组创建数组数组元素的访问数组元素的练习输出下列数组的最大值、最小值数组中去掉所有的0元素数组元素的倒置二维数组创建二维数组二维数组的访问二维数组的练习找出二维数组每一行的最大值输出二维数组每行、每列、对角线元素之和二维数组的转置让二维数组的每行元素都是 降序 排列数组数组是一组类型相同的数据的集合，其中的每个数据被称作元素，在数组中可以存放任意类型的元素。创建数组1、使用new创建数组 var 数组名=new Array（）2、使用字面量创建数组 var 数组名=[ ]数组元素

文章目录流程控制顺序结构分支结构if语句if...else语句if...else if语句三元表达式switch语句循环结构while循环do-while循环for循环循环嵌套continue、break关键字流程控制在一个程序执行的过程中，各条代码的执行顺序对程序的结果是有直接影响的。很多时候我们要通过控制代码的执行顺序来实现我们要完成的功能。流程控制主要有三种结构，分别是顺序结构、分支结构和循环结构，这三种结构代表三种代码执行的顺序。顺序结构程序中最简单、最基本的流程控制，无特定语法结构，按

文章目录JavaScript 概述JS 简介常见浏览器JS 特点和组成JS 使用方法及语法规则输入和输出变量什么是变量变量的使用命名规范数据类型数据类型的分类数据类型的转换运算符常用运算符运算符优先级JavaScript 概述JS 简介JavaScript： 是Web开发领域中的一种功能强大的编程语言，主要用于开发交互式的Web页面。在计算机、手机等设备上浏览的网页，其大多数的交互逻辑几乎都是由JavaScript实现的。JavaScript内嵌于HTML网页中，通过浏览器内置的JavaScript

文章目录CSS3高级应用过渡变形动画多媒体嵌入图像视频音频CSS3高级应用在传统的Web设计中，当网页中需要显示动画或特效时，需要使用JavaScript脚本或者Flash来实现。在CSS3中，提供了对动画的强大支持，可以实现旋转、缩放、移动和过渡等效果。过渡属性描述属性值transition-property用于指定过渡效果①none ②all ③prpperty（定义多个名称用逗号分隔）transition-duration用于指定过渡的持续时间s/ms

学习过程中发现一个很好用的截图、贴图工具，作以分享，个人感觉比win10自带截图工具和qq截图工具更好使用。Snipaste：是一个很简单但强大的截图工具，也可以将屏幕截图贴回到屏幕上。常用的快捷键：F1可以进行截图，同时测量大小、设置箭头、书写文字等F3在桌面中可以置顶显示点击图片，alt可以进行取色（按下shift可以切换取色模式）按ESC取消图片显示等…提取链接：https://pan.baidu.com/s/1-jx1YvsuPaiQZlRSR_IICA)提取码：5rp4免安

文章目录布局概述网页布局目的和思想页面元素定位机制布局常用属性浮动属性（float）清除属性（clear）定位属性（position）溢出属性（overflow）层叠属性（Z-index）布局类型常见类型单列布局双列布局三列布局通栏布局HTML5中语义标签命名规范布局概述DIV+CSS布局：网页html通过DIV标签+CSS样式表代码开发制作的（html）网页的统称网页布局目的和思想目的：使页面结构清晰、有条理、易读思想：确定"版心"：页面主体内容所在位置 （通常在页面中水平居中）分析页面中

文章目录盒子模型认识盒子模型盒子模型的相关属性边框属性外边距属性内边距属性背景属性CSS3新增盒子模型属性元素类型转换块级元素行内元素div和span标签元素类型转换盒子模型认识盒子模型盒子模型：网页布局的基础一个盒子可以分成四个部分：margin（外边距）、border（边框）、padding（内边距）、content（内容）。margin、border、padding是CSS属性，因此可以通过这三个属性来控制盒子的这三个部分。而content则是HTML元素的内容。盒子的大小：盒子的总

文章目录CSS内容CSS功能CSS的使用样式规则特性CSS属性颜色表示方式尺寸表示方式图像表示方式文本样式属性列表样式规则CSS选择器（核心）基本选择器属性选择器复合选择器关系选择器伪类选择器CSS优先级：要看选择器的权重CSS内容CSS功能CSS：可叫作层叠样式表 用于结构和表现分离HTML只负责展示内容，搭建网页的基本结构，所有样式都由CSS来进行设置CSS的使用应用CSS的方法页面嵌入式：<style type="text/css"> CSS的样式规则</st

文章目录表格标签表单标签表格标签表格含义：表格是较为常用的一种标签，但不是用来布局，常见处理、显示表格式数据。在HTML网页中，要想创建表格，就需要使用表格相关的标签。<table></table> 表格<tr></tr> 行<td></td> 单元格<th></th> 列标题<caption></caption> 表

文章目录HTML、CSS、JavaScript的关系HTML标签标签的结构标签的类型常用标签标题标签段落标签换行标签水平分割线标签字体标签文本格式化标签图像标签超链接标签特殊字符下标标签语义标签文本语义标签背景标签滚动标签列表标签无序列表有序列表项目列表（自定义列表）列表标签的嵌套HTML、CSS、JavaScript的关系HTML 用于构建网页结构，展示页面内容CSS 用于美化网页，布局页面JavaScript 用于控制页面元素，与后端数据交互HTML标签标签的结构<!DOCTYP