- 博客(29)
- 收藏
- 关注
原创 Ajax 提交表单数据和拦截器
本章节讲解: 表单的组成、表单的提交事件和阻止默认行为、jQuery 的 serialize()函数、axios请求方法别名, axios 拦截器概念、axios 请求拦截器、axios 响应拦截器、loading效果。
2022-07-02 20:52:14
340
原创 javascript事件流
事件流是对事件执行过程的描述,了解事件的执行过程有助于加深对事件的理解,提升开发实践中对事件运用的灵活度。 任意事件被触发时总会经历两个阶段:【捕获阶段】和【冒泡阶段】。简言之,捕获阶段是【从父到子】的传导过程,冒泡阶段是【从子向父】的传导过程。
2022-06-01 21:18:51
261
原创 间歇函数,事件监听。
间歇函数知道间歇函数的作用,利用间歇函数创建定时任务。setInterval 是 JavaScript 中内置的函数,它的作用是间隔固定的时间自动重复执行另一个函数,也叫定时器函数。<script> // 1. 定义一个普通函数 function repeat() { console.log('不知疲倦的执行下去....') } // 2. 使用 setInterval 调用 repeat 函数 // 间隔 1000 毫秒,重复调用 repeat
2022-05-31 16:26:05
561
原创 Web Apis
介绍知道 ECMAScript 与 JavaScript 的关系,Web APIs 是浏览器扩展的功能。严格意义上讲,我们在 JavaScript 阶段学习的知识绝大部分属于 ECMAScript 的知识体系,ECMAScript 简称 ES 它提供了一套语言标准规范,如变量、数据类型、表达式、语句、函数等语法规则都是由 ECMAScript 规定的。浏览器将 ECMAScript 大部分的规范加以实现,并且在此基础上又扩展一些实用的功能,这些被扩展出来的内容我们称为 Web APIs。.
2022-05-30 21:21:16
168
原创 内置对象的使用
内置对象回想一下我们曾经使用过的 console.log,console其实就是 JavaScript 中内置的对象,该对象中存在一个方法叫 log,然后调用 log 这个方法,即 console.log()。除了 console 对象外,JavaScritp 还有其它的内置的对象MathMath 是 JavaScript 中内置的对象,称为数学对象,这个对象下即包含了属性,也包含了许多的方法。属性 Math.PI,获取圆周率 // 圆周率console.log(Math.
2022-05-30 21:14:41
102
原创 对象的基本使用
对象对象是 JavaScript 数据类型的一种,之前已经学习了数值类型、字符串类型、布尔类型、undefined。对象数据类型可以被理解成是一种数据集合。它由属性和方法两部分构成。语法声明一个对象类型的变量与之前声明一个数值或字符串类型的变量没有本质上的区别。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>对象语法</t..
2022-05-27 21:34:19
224
原创 函数的基本使用
函数理解函数的封装特性,掌握函数的语法规则声明和调用函数可以把具有相同或相似逻辑的代码“包裹”起来,通过函数调用执行这些被“包裹”的代码逻辑,这么做的优势是有利于精简代码方便复用。声明(定义)声明(定义)一个完整函数包括关键字、函数名、形式参数、函数体、返回值5个部分调用声明(定义)的函数必须调用才会真正被执行,使用 () 调用函数。<!DOCTYPE html><html lang="en"><head> &...
2022-05-25 21:37:33
219
原创 数组的基本使用
数组知道什么是数组及其应用的场景,掌握数组声明及访问的语法。数组是什么?数组:(Array)是一种可以按顺序保存数据的数据类型使用场景:如果有多个数据可以用数组保存起来,然后放到一个变量中,管理非常方便数组的基本使用定义数组和数组单元<script> // 1. 语法,使用 [] 来定义一个空数组 // 定义一个空数组,然后赋值给变量 classes // let classes = []; // 2. 定义非空数组 let classe...
2022-05-25 21:29:54
301
原创 for语句的基本使用
实现循环的 3 要素<script> // 1. 语法格式 // for(起始值; 终止条件; 变化量) { // // 要重复执行的代码 // } // 2. 示例:在网页中输入标题标签 // 起始值为 1 // 变化量 i++ // 终止条件 i <= 6 for(let i = 1; i <= 6; i++) { document.write(`<h${i}>循环控制,即重复执行<h${i}>`)...
2022-05-24 21:06:57
464
原创 while循环
循环作用:重复执行一些操作,如while循环 for循环.while循环语法:while (循环条件) { 重复执行的代码(循环体)}跟if语句很像,都要满足小括号里的条件为true才会进入 循环体 执行代码while大括号里代码执行完毕后不会跳出,而是继续回到小括号里判断条件是否满足,若满足又执行大括号里的代码,然后再回到小括号判断条件,直到括号内条件不满足,即跳出循环三要素:1.变量起始值2.终止条件(没有终止条件,循环会一直执行,造成死循环)3.变量变..
2022-05-24 21:01:25
1200
原创 表达式和语句
表达式是可以被求值的代码,JavaScript 引擎会将其计算出一个结果。(简单理解表达式就是一个式子)语句是一段可以执行的代码。(比如: prompt() 可以弹出一个输入框)分支语句以前我们写的代码,写几句就从上往下执行几句,这种叫顺序结构有的时候要根据条件选择执行代码,这种就叫分支结构某段代码被重复执行,就叫循环结构if分支if语句有三种使用:单分支、双分支、多分支单分支语法:if(条件){ 满足条件执行的代码} 括号内的条件为true..
2022-05-23 16:57:31
711
原创 运算符的使用
1.赋值运算符赋值运算符:对变量进行赋值的运算符赋值运算符(=)将等号右边的值赋予给左边, 要求左边必须是一个容器其它赋值运算符:+=,-=,*=,/=,%=;使用这些运算符可以在对变量赋值时进行快速操作 let num = 1 // 采取赋值运算符 // num = num + 1 // num += 1 num += 3 console.log(num)一元运算符一元运算符:正负号前置自增:++i后置自增:i++前置自增和...
2022-05-23 16:50:30
826
原创 javaScript基础
JavaScript 基础了解变量、数据类型、运算符等基础概念,能够实现数据类型的转换,结合四则运算体会如何编程。MDN:mdn.dev现代 JavaScript 教程:现代 JavaScript 教程 体会现实世界中的事物与计算机的关系 理解什么是数据并知道数据的分类 理解变量存储数据的“容器” 掌握常见运算符的使用,了解优先级关系 知道 JavaScript 数据类型隐式转换的特征 JavaScript介绍掌握 JavaScrip.
2022-05-21 21:23:55
267
原创 媒体查询,bootstrap。
1媒体查询学习媒体查询的目的: 了解如何使用媒体查询做响应式页面。 为接下来学的 Bootstrap 做铺垫。 媒体查询会写如下代码即可:body { background-color: gray;}/* 大于等于768px 为粉色 */@media (min-width: 768px) { body { background-color: pink; }}/* 大于等于992px 为蓝色 */@media (min-...
2022-05-19 21:39:19
708
原创 移动端vw/vh
vwvw就是视口的宽度,vw 是个相对单位。不管在什么屏幕下, 我们把屏幕分为平均的 100等份。1vw = 1 / 100 屏幕的宽度1vw 和 1%width: 1vw;width: 1%;vw 和 1% 有没有区别: vw 永远是以视口的宽度为准。· 在 375设计稿下, 1vw 永远是 3.75px 百分比以父盒子为准。 假如父盒子是 200px,则 1% 是 2px px 如何转为vw我们设计稿是 iphone 678 是 375px, vw
2022-05-19 21:21:30
828
原创 移动端的适配方案
移动端的适配方案: flex + rem单位 做适配效果 (比如淘宝和小米移动端) 当前市场最多 flex + viewport width /vh单位 做适配效果 (比如 B站移动端 ) 新兴,马上的一个趋势 让flex做布局(盒子摆放),让rem或者vw/vh 实现网页元素的尺寸(宽度和高度)适配屏幕rem 适配rem 单位rem 是一个相对单位,1rem 就是 html 文字的大小比如html { font-size: 35px;}则此时 1..
2022-05-16 20:36:36
2544
原创 flex布局2
1.设置主轴方向主轴默认是水平方向, 侧轴默认是垂直方向修改主轴方向属性: flex-direction属性值 作用 row 行, 水平(默认值) column *列, 垂直 row-reverse 行, 从右向左 column-reverse 列, 从下向上 语法:flex-direction:column;修改完毕,主轴是Y轴, 侧轴是X轴。如何去算是几倍图精灵图的宽度/装精灵图盒子的宽度=倍数修改主轴经常的
2022-05-15 20:46:35
159
原创 移动端flex布局
移动端特点PC端/移动端不同?PC端 屏幕大,网页固定版心 端浏览器繁多,更多考虑兼容性问题。(布局: 浮动+定位+标准流) 移动端 手机屏幕小,网页宽度多数为100%,是适配手机屏幕宽度 移动端则基本不需要考虑兼容性问题,放心大胆使用CSS新特性 物理分辨率和逻辑分辨率 物理分辨率:硬件所支持的,屏幕出厂就设定无法修改 逻辑分辨率:软件可以达到的, 我们开发中写的是逻辑分辨率 视口视口(viewport)就是浏览器显示页面内容的屏幕区
2022-05-14 20:15:41
844
原创 3D空间转换
一、空间转换 3D3D坐标系3D 坐标系比2D 多了一个Z轴。一定要记住3个坐标轴取值的正反: X 轴 往右越大,是正值, 否则反之 Y 轴 往下越大,是正值,否则反之 Z轴 (指向我们)越大,是正值,否则反之 3D位移有完整写法: transform: translate3d(x, y, z);只不过在很多情况下,我们经常喜欢分开写:transform: translateX(100px);transform: transl
2022-05-12 20:57:58
158
原创 动画的基本使用
一、动画动画最大的特点可以不用鼠标触发,自动的,反复的执行某些动画。动画使用分为定义和调用: 定义:定义使用 @keyframes+动画名字(参考类名)来定义 /* 1. 定义的动画 */@keyframes dance { 从一倍放大到1.5倍 from { transform: scale(1) } to { transform: scale(1.5) }} 或者是 /* 1. ...
2022-05-12 20:23:37
277
原创 字体图标,2d变形,渐变。
一.使用字体图标1.引入相关文件 复制相关的文件,到 fonts文件夹里面。 引入 css <link rel="stylesheet" href="./fonts/iconfont.css"> 2.使用类名引入字体图标如果是一个标签来使用字体文件,可以采取2个类名的形式。(开发最常用)<span class="iconfont icon-daohangdizhi"></span> 第一个类名 iconfont 目的是告
2022-05-11 21:43:50
95
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人