04 2022 档案
摘要：什么是表单 表单在网页中主要负责数据采集功能。HTML 中的 <form> 标签，就是用于采集用户输入的信息，并通过<form>标签的提交操作，把采集到的信息提交到服务器端进行处理。 表单组成部分 表单由三部分组成 表单标签 表单域 表单按钮 表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框
阅读全文
摘要：接口的概念 使用 Ajax 请求数据时，被请求的 URL 地址，就叫做数据接口(简称接口)。同时，每个接口必须有请求方式。 接口测试工具 好处：接口测试工具能让我们在不写代码的情况下，对接口进行调用和测试。 下载安装 PostMan 网址：https://www.getpostman.com/dow
阅读全文
摘要：请求方式 客户端请求服务器时，请求的方式有很多种，最常见的两种请求方式分别是 get 和 post 请求。 get 请求 get 请求通常用于获取服务器的资源(拿数据)，例如根据 URL 地址，从服务器获取 HTML 文件、CSS 文件、数据资源等。 post 请求 post 请求通常用于向服务器提
阅读全文
摘要：客户端服务器的通信过程 1、客户端向服务器发送请求。 2、服务器处理客户端发来的请求。 3、服务器响应给客户端。 客户端：首先打开浏览器，然后输入要访问的地址，最后回车向服务器发送请求。 服务器：首先收到客户端发来的请求，然后再内部处理请求，并找到相关资源，最后响应给客户端。 注意：客户端与服务器之
阅读全文
摘要：URL URL地址的概念 URL：中文叫统一资源定位符，全称是 Uniform ResourceLocator。用于标识互联网上每个资源的唯一存放位置。浏览器只有通过 URL 地址，才能正确定位资源的存放位置，从而访问到对应的资源。比如 http://www.baidu.com。 URL 的组成 一
阅读全文
摘要：服务器与客户端 服务器：在上网过程中，负责存放和对外提供资源的电脑，叫做服务器。 客户端：在上网过程中，负责获取和消费资源的电脑，叫做客户端。
阅读全文
摘要：什么是 OSI 七层模型 OSI 协议就是一系列的网络协议，按照功能和分工，人为的分为七层。实际上这七层是不存在的，没有这七层的概念。只是人为的划分而已，划出七层的目的是明白哪一层是干什么的。 OSI 七层模型：开放系统互连参考模型，它是国际标准化组织和国际电报电话咨询委员会联合制定的开放系统互连参
阅读全文
摘要：网络协议 TCP/IP 四层应用模型 应用层：HTTP、DNS、FTP、SMTP、TELNET。 传输层：TCP、UDP。 网络层：IP、ICMP、ARP、RARP。 接口层：各种物理通信网络接口。 IP ip：Internet Protocol，相当于网络中的一个节点，类似于地址，我们称之为 IP
阅读全文
摘要：网络历史 网络按照覆盖范围 1、局域网 LAN(作用范围一般为几米到几十公里)。 2、城域网 MAN(界于 WAN 与 LAN 之间)。 3、广域网 WAN(作用范围一般为几十到几千公里)。 按连接介质分为 无线、有线、光纤。 按连接协议分 手机、http。 主要功能 1、资源共享。 2、快速传输信
阅读全文
摘要：数据可视化 主要目的：借助于图形化的手段，清晰有效的传达与沟通信息。 数据可视化可以把数据从冰冷的数字转换成图形，揭示蕴含在数据中的规律和道理。 应用场景：通用报表、移动端图表、大屏可视化、图编辑&图分析、地理可视化。 ECharts 基本使用 1、下载并引入 echarts.js 文件。 2、准备
阅读全文
摘要：如果想要把某个对象拷贝( 合并 )给另一个对象使用，此时可以使用 $.extend() 方法。 语法：$.extend([deep], target, object1, [objectN]) 1、deep：如果设为 true 为深拷贝，默认是 false 浅拷贝。 2、target：要拷贝的目标对象
阅读全文
摘要：单个注册事件 语法：element.事件( function ( ) { } )，比如 $('div').click( function ( ) { 事件处理程序 } )。 事件处理 on() 绑定事件 on() 方法在匹配元素上绑定一个或多个事件的事件处理函数。 语法：element.on( ev
阅读全文
摘要：jQuery尺寸 语法 用法 width() / height() 取得匹配元素宽度和高度值，只算width/height innerWidth() / innerHeight() 取得匹配元素宽度和高度值，包含 padding outerWidth() / outerHeight() 取得匹配元素
阅读全文
摘要：遍历元素 jQuery 隐式迭代是对同一类元素做了同样的操作。如果想要给同一类元素做不同的操作，就需要用到遍历。 语法1：$('div').each(function ( index, dmoEle ) { xxx })。 这个方法遍历匹配的每一个元素，主要用 DOM 处理。参数 index 是每个
阅读全文
摘要：jquery 选择器 jQuery 基础选择器 $('选择器')：选择器直接写 CSS 选择器，但是要加引号。 jQuery 层级选择器 名称 用法 描述 子代选择器 $('ul > li') 使用 > 号，获取亲儿子层级的元素，不会获取孙子层级的元素 后代选择器 $('ul li') 使用空格，代
阅读全文
摘要：JS 库 js 库：即 library，是一个封装好的特定的集合(方法和函数)。从封装一大堆函数的角度理解库，就是在这个库中，封装了很多预先定义好的函数在里面，比如动画 animate、hide、show，比如获取元素等。 jQuery jquery 入口函数 $( function() { } )
阅读全文
摘要：本地存储的特性 1、数据是存储在用户的浏览器中。 2、设置、读取方便，甚至页面刷新或关闭都不会丢失数据。 3、容量较大，sessionStorage 约 5M、localStorage 约 20M。 4、只能存储字符串，可以将对象 JSON.stringify() 编码后存储。 window.ses
阅读全文
摘要：classList 属性 classList 属性是 H5 新增的一个属性，返回元素的类型。但是 IE10 以上版本支持。 该属性用于在元素中添加、移除以及切换 CSS 类。 添加： element.classList.add( ' 类名 ' )。 focus.classList.add('curr
阅读全文
摘要：触屏事件 移动端的浏览器兼容性较好，不需要考虑 JS 的兼容性问题，可以放心的使用原生 JS 书写效果，但是移动端也有自己独特的地方。比如触屏事件 touch，Android 和 IOS 都有。 touch 对象代表一个触摸点。可能是一根手指、一根触摸笔。触屏事件可以响应用户手指(或触控笔)对屏幕或
阅读全文
摘要：节流阀 目的：当上一个函数动画执行完毕，再去执行下一个函数动画，让事件无法连续触发。 实现思路：通过回调函数，添加一个变量来控制，封锁或解锁函数。 筋斗云导航栏 鼠标移到某个 li 上面就让筋斗云跑到对应的 li 上面。鼠标滑出就让筋斗云回到起始位置。这里需要在外边提前声明一个存放起始位置的变量，如
阅读全文
摘要：页面结构 整个轮播图是由一个 div 包裹，左右箭头是两个 a 标签，左右箭头默认隐藏。 图片部分由 ul 包裹，每张图片都由一个 li 包裹。小圆点部分是由 ol 包裹，里面的 li 根据有多少张图片动态生成。 鼠标滑入显示左右箭头和滑出隐藏左右箭头 首先获取到轮播图的大盒子，然后再获取左右箭头。
阅读全文
摘要：navigator 对象 navigator 对象包含有关浏览器的信息，它有很多属性，最常用的是 userAgent，该属性可以返回由客户机发送服务器的 user-agent 头部的值。 <button>刷新</button> <script> document.querySelector('but
阅读全文
摘要：定时器 两种定时器 1、setTimeout()：window.setTimeout(调用函数， [延迟的毫秒数])，该定时器在定时器到期会执行调用函数。调用的函数可以是匿名函数，也可以是函数名。 延迟的毫秒可以不写，默认为 0。定时器在一个页面里可能有很多个，所以要给定时器赋值一个标识符。 清除
阅读全文
摘要：attachEvent 事件监听方式 语法：eventTarget.attachEvent(eventNameWithOn, callback)。 eventNameWithOn：事件类型字符串，比如 onclick，onmouseover，这里要带 on。 callback：事件处理函数，当目标触
阅读全文
摘要：节点操作 三种动态创建元素的区别 1、document.write()：它是直接将内容写入页面的内容流，但是当文档流执行完毕，则它会导致页面全部重绘(将页面内容重置)。 2、element.innerHTML = ""：它是将内容写入某个 DOM 节点，不会导致页面全部重绘 3、document.c
阅读全文
摘要：排他思想(算法) 如果有同一组元素，我们想要某一个元素实现某种样式，需要用到循环的排他思想算法。 1、所有元素全部清除样式 2、给当前元素设置样式 3、注意顺序不能颠倒，首先清除其他元素的样式，然后再设置当前元素的样式 <button>按钮1</button> <button>按钮2</button
阅读全文
摘要：DOM Dom树 文档：一个页面就是一个文档，DOM 中使用 document 来表示。 元素：页面中的所有标签都是元素，DOM 中使用 element 来表示。 节点：网页中的所有内容都是节点(标签、属性、文本、注释等)，DOM 中使用 node 来表示。 DOM 把以上内容都看做是对象。 获取网
阅读全文
摘要：简单数据类型和复杂数据类型 简单类型有叫做基本数据类型或者值类型，复杂类型又叫做引用类型。 值类型：简单数据类型/基本数据类型，在存储时变量中存储的值是本身，因此叫做值类型。 引用类型：复杂数据类型，在存储时变量中存储的仅仅是地址（引用），因此叫做引用数据类型。通过 new 关键字创建的对象（系统对
阅读全文
摘要：内置对象 内置对象就是指 JS 语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要的功能(属性和方法)。 查文档的步骤 1、查阅该方法的功能。 2、查看里面参数的意义和类型。 3、查看返回值的意义和类型。 MDN文档：https://developer.mozilla.or
阅读全文
摘要：作用域 通常来说，一段程序中所用到的名字并不总是有效和可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字冲突。简单来说就是代码名字在某个范围内起作用和效果，目的是为了提高程序的可靠性更重要的是减少命名冲突。 作用域：(es
阅读全文
摘要：数组 数组可以把一组相关的数据一起存放，并提供方便的访问(获取)方式。数组是指一组数据的集合，其中的每个数据都被称为元素，在数组中可以存放任意类型的元素。数组是一种将一组数据存储在单个变量名下的优雅方式。 创建数组 1、利用 new Array() 创建数组 格式：let 数组名 = new Arr
阅读全文
摘要：双重 for 循环 嵌套循环：指在一个循环语句中再定义一个循环语句的语法结构，例如在 for 循环中再嵌套一个 for 循环，这样的循环称为双重 for 循环。 语法结构：for( 外层初始变量; 外层条件表达式; 外层操作表达式 ){ for( 内层初始变量; 内层条件表达式; 内层操作表达式 )
阅读全文
摘要：运算符 算数运算符：用来对变量进行加减乘除等操作。 算数运算符有：加(+)、减(-)、乘(*)、除(/)、取余(%)。取余就是取取余数。 表达式和返回值 由数字、运算符、变量等组成的式子叫表达式，表达式计算完的返回的结果叫返回值。 自增和自减 自增(++)和自减(--)可以对一个数进行自动的加一或减
阅读全文
