晚风一直很温柔。-CSDN博客

原创 html5 01

requires 模块覆盖关系：两个没有id的模块前面覆盖后面两个相同id模块，前面覆盖后面多个不相同id模块，共同兼容接口定义：module transpots return值 | 引用 commonjs module.export接口|module exports = 值| 对象 | 函数 paths 简化文件路径 shim 将文件转为模块 map 映射文件 baseUrl 设置根目录 css插件 map进行配置 {css:'文件'} css!文件本地存储 loca

2022-03-05 16:33:37 547

原创 js进阶 09

requirejs 引入requirejs 三个全局变量： require requirejs define 入口文件：引入的第一个文件两种方式：data-main 根目录是属性值 require['xxx'] 以index.html 所在的目录为根目录定义模块传递一个参数：不能是字符串，可以是函数，此时函数遵循的是commonjs规范。require exports module 传递两个参数：第一个可以是字符串，还可以是模块依赖集合，此时函数遵循module transport

2022-03-05 15:31:58 194

原创 js进阶 08

git 代码存储系统，用来托管代码 linux 指令 cd目录打开目录 ls 查看当前目录文件 pwd 查看当前目录所在系统路径 mkdir 文件名创建文件夹 touch文件名创建文件 echo 内容>>文件 cat文件查看文件内容 git文件：1 未纳入缓存的文件 2 纳入缓存的文件 3 纳入版本库的文件使用git git init 初始化一个git仓库 git add 将第二类文件纳入缓存，可通过*将所有文件纳入缓存 git status 查看文件状态 git

2022-03-05 15:15:32 467

原创 js进阶 07

内置构造函数：Object Array Function Number String Boolean RegExp Error Date Image 构造函数式继承：为了继承父类中的属性执行父类构造函数并改变this指向，传递必须的参数类式继承：继承父类中的方法子类的原型=父类的实例补回自身constructor的属性寄生式继承：定义寄生函数，函数体中定义寄生类，寄生类的原型指向父类的原型，子类的原型指向寄生类的实例，补回子类的constructor 组合式继承 ...

2022-03-05 14:48:35 187

原创 js进阶 06

1 原型：prototype 是每个函数都天生拥有的属性值是一个对象，通过constructor 判断，指向构造函数本身作用：实现共享数据 2 原型拓展 instanceof haswOwnproperty不能查看原型数据 in 操作符查找原型数据 3 安全类 Object Array 无论在外部如何调用类，都会返回类的实例 4 内置构造函数 Object Array Number String Boolean RegExp Error Date Function(除了最后一个参

2022-03-05 12:25:10 150

原创 js进阶 05

1 面向对象：书写代码的另一种方式 2 构造函数：定义上与普通函数一样，首字母要大写，非语法要求目的：普通函数：实现功能构造函数：创建对象调用方式：普通函数：直接调用构造函数：使用new 关键字 3 构造函数执行的4个步骤 1 开辟新的内存空间 2 改变this指向 3 执行函数体中的代码：为this赋值 4 返回this 4 使用return 问题返回值的类型被忽略返回引用了类型以返回的数据为准在构造函数体中不要出现return语句 ...

2022-02-19 21:29:50 320

原创 js进阶 04

1 touch事件： touchstart 点击穿透的问题 1 延迟执行语句 2 替换为onclick事件 touchend touchmove touchcancel 2 过渡事件 transitionstart transitionend 3 动画事件 animationstart animationend 4 zepto:针对于移动端的js库引入之后$函数模块化：使用animate 必须下载fx touch模块 tap 触碰/点击 doubleTap singleTap

2022-02-19 21:18:27 297

原创 js进阶 03

1 快捷尺寸源生 clientWidth clientHeight offsetWidth offsetHeight clientLeft clientTop jquery width() height() innerWIdth() innerHeight() outerWidth() outerHeight() outerWidth(true) outerHeight(true) 2 定位父元素 offsetParent 3 定位值 offsetLeft offsetTop

2022-02-19 19:31:21 247

原创 js进阶 02

1 更改this指向 call :第一个参数改变的是this的指向从第二个参数开始表示传递的参数 apply :第一个参数改变的是this的指向从第二个参数是数组 2 事件流程捕获：事件从最顶层元素开始执行，一层一层往下执行，直到最精确的元素冒泡:事件从最精确的元素开始执行，一层一层往上执行，直到最顶层元素当一个元素处于最精确的元素的时候，是不区分捕获和冒泡的完整流程：事件捕获找到元素，触发事件，事件冒泡到最顶层元素 3 dom2级：addEventListener(type,c

2022-02-19 16:52:26 205

原创 js进阶 01

1 javascript:dom 、 bom 、 ECMA组成 dom:文档对象模型（在代码中是document ） bom：浏览器对象模型（在代码中是window） ECMA:核心语法，包含如何定义变量、运算符、表达式、流程控制语句、数据类型 2 节点操作 1 可通过dom的onclick 、onmousedown、onmouseup来添加事件 2 通过dom的getElementById获取元素 3 通过dom的style来设置样式 3 节点类型： dom是由节点组成的，元素/标

2022-02-19 11:42:45 227

原创 jquery 02

animate函数：用于执行动画 animate({},time,callback) 是基于终点的动画延迟：delay方法参数就是延迟的时间单位是ms 省略不写 stop:停止动画两个参数都是布尔值默认是false stop(false,false) stop(fasle,true) stop(true,true) stop(true,false) 动画积累：两种策略 1 通过stop(true)清空动画队列 2 通过is()方法 ...

2022-02-19 09:20:28 223

原创 jquery 01

1 jquery函数:所有的语句都是以$开头，参数接收选择器 2 选择器支持css2.1 支持css3 $(dom：first) $(dom:last) $(dom:eq(index))===(dom).eq(index) $(dom:gt(index)) $(dom:lt(index)) $(dom:odd) $(dom:even） 3 常用方法 length 属性获取长度： 1 读取一个参数 2 设置单个样式：两个参数 key:value 3 设置多个样式：参数是

2022-02-18 21:24:18 241

原创 day29

1 正则的修饰符 i 不区分大小写 m 多行匹配 g 全局匹配 2 正则的组成：普通字符：数字字母下划线特殊字符：（）分组 [] 区间范围 \ 转义字符 / 创建正则 | 或 . 除了回车和换行 ^ 放在[]里面是取反，放在外头是开头 $ 结束 * 出现0次或多次？出现0次或1次 + 质数出现1次 3 边界词 ^ 开头 $ 结尾 /b 单词边界 /B 非单词边界 4 分组（）分组作用：伪类捕获，重复利用在正则的内部使用，用\编号在

2022-01-26 15:34:43 202

原创 day28

1 字符串：写在引号里面的都是字符串字符串中的数据是按照下标排列，下标从0开始，到length-1结束 length是字符串的个数，空格也算字符串 2 字符串相关方法 charAt(下标)：查找下标所对应的字符串。如果存在，返回对应字符，不存在返回空，不写下标默认是0 ，如果比0小或者比最大的下标大返回空 charCodeAt(下标)：查找下标所对应的字符串。如果存在，返回对应的编码，不存在返回NaN，不写下标默认是0 ，如果比0小或者比最大的下标大返回NaN concat:字符串的拼接 t

2022-01-23 21:09:03 510

原创 day27

1 闭包：可以保护数据，不会破坏全局变量闭包变量不会被垃圾回收机制回收 2 数组：盒子，存储各种数据，数据是有规律的排列，按照下标下标从0开始到length-1结束可以通过for循环遍历组数组【下标】=值如果数组中存在这个下标是替换，不存在则是添加，如果设置下标过大，前边没有数据则用空来补充 3 length代表的是数据的个数数组的常用方法 pop末尾删除 push末尾添加 shift 开头删除 UNshift 开头添加 concat 数组的拼接 join 将数组转换

2022-01-22 15:36:35 244

原创 day26

1 函数的特殊参数：arguments 是一个伪数组（类数组）可以看做是一个盒子，盒子里存放着我们传递进来的参数每一个参数都存在自己的下标，是按照顺序排列的，下标从0开始，到arguments.length-1结束 arguments.length是参数的个数 2 函数的返回值：return 关键字，return关键字之后的所有程序都不执行函数的类型：复杂数据类型复杂数据类型在赋值的时候赋值的是一个地址递归函数：函数内部调用函数本身解决一些数学问题作用域：一个变量的生效范围

2022-01-21 20:31:34 254

原创 day25

1 穷举法：一次列出所有的可能性，使用for循环通过判断语句来找到需要的内容 2 水仙花数：个位的立方+十位的立方+百位的立方=该数本身 3 累加器和累积器需要在外部声明一个变量在循环结束之后需要打印累加器：外部变量的初始值为0 累积器：外部变量的初始值为0 4 循环 while和do while 相同点：都是循环语句，如果循环语句与循环变量改变了顺序在上或者在下，两个的结果不同不同点：while是先判断再执行，do while是先执行再判断，do while不管条件是否

2022-01-21 19:47:13 141

原创 day24

1 parseint的使用将其他的数据类型转换成number 可以对小数进行取整操作进制数：两个参数，第一个是数字，第二个代表进制数，最多36进制，0~10都市10进制 2 赋值运算符 += -= *= /= %= ++自身加1（前置：先赋值后运算，后置：先运算再赋值） --自身减1（前置：先赋值后运算，后置：先运算后赋值） 3 位运算（了解） 4 流程控制语句 if if() {} if() {}else{} 可以使用三元运算代替 if() {}else if() {}.....

2022-01-19 15:49:30 141

原创 day24

1 parseint的使用将其他的数据类型转换成number 可以对小数进行取整操作进制数：两个参数，第一个是数字，第二个代表进制数，最多36进制，0~10都市10进制 2 赋值运算符 += -= *= /= %= ++自身加1（前置：先赋值后运算，后置：先运算再赋值） --自身减1（前置：先赋值后运算，后置：先运算后赋值） 3 位运算（了解） 4 流程控制语句 if if() {} if() {}else{} 可以使用三元运算代替 if() {}else if() {}.....

2022-01-19 15:44:42 617

原创 day23

1 数据类型的转换转换成字符串：添加引号转换成数字 number（要转换的数据） 1 整体转换，不能转换就是NaN 2 true===1 false===0 null===0 3 可以识别一个小数点 parseint(要转换的数据) 1一位一位的转换，第一位可以转换就转换，不可以就直接NaN 2 不识别小数点 parsefloat(要转换的数据) 1 一位一位的转换，第一位可以转换就转换，不可以就直接NaN 2 识别小数点 2 数学运算符 1 隐式数据类型的转换：*1 /1

2022-01-19 15:15:18 228

原创 day21

1 JavaScript 作用：页面的前后端交互，表单验证 js组成： ecma：规定js的标准规则，js语法规范 dom:文档对象模型，一整套操控文档元素的方式方法 bom:浏览器对象模型，一整套操控浏览器对象的方式方法 2 js的书写 1 行内式：写在html标签的内部，不建议使用 js弹框 alert("内容") a 标签 <a href="javascript:alert(内容)">内容</a> 如果一个标签中同时存在两个href属性，一个是超链接一个是js

2022-01-15 21:00:23 136

原创 day21

1 JavaScript 作用：页面的前后端交互，表单验证 js组成： ecma：规定js的标准规则，js语法规范 dom:文档对象模型，一整套操控文档元素的方式方法 bom:浏览器对象模型，一整套操控浏览器对象的方式方法 2 js的书写 1 行内式：写在html标签的内部，不建议使用 js弹框 alert("内容") a 标签 <a href="javascript:alert(内容)">内容</a> 如果一个标签中同时存在两个href属性，一个是超链接一个是js

2022-01-15 20:35:22 244

原创 day20

1 列表布局 float+margin实现，注意点：父元素不能存在width 结构伪类选择器实现弹性盒实现多列实现：瀑布流网格实现：电子相册设置网格 display:grid/inline-grid 设置列宽度 grid-templete-columns:repeat(列数，宽度) 设置行高度 grid-templete-rows:repeat(行数，高度) 设置单元格的间距 grid-gap 划分区域 grid-templete-areas 子元素指定对应区域 grid-ar

2022-01-15 11:37:57 451

原创 day18

1 弹性父元素的属性设置弹性盒 display:flex 弹性子元素的排列方式和是否允许换行 flex-flow flex-direction 排列方式 row默认 row-reverse水平翻转 column自上而下 column-reverse 自上而下翻转 flex-wrap 是否允许换行 nowrap 不允许，默认 wrap允许 wrap-reverse允许换行翻转弹性子元素存在换行行的控制 align-content flex-start flex-end center sp

2022-01-11 20:23:56 204

原创 day17

1 倾斜 skew skew(角度) -- skewx(角度) skew(x,y) skewx() skewy() 内容会跟着倾斜 2 偏移 translate 在原来位置上的偏移值可以设置具体的数值，可以设置百分比（自身宽度高度的百分比） translate（偏移值）---translatex() translate(x，y) translate3d（x,y,z） translatex 正值向右，负值向左 translatey 正值向下负值向上 translatez 正值

2022-01-10 16:11:04 129

原创 day16

1 背景渐变：background或background-img 线性渐变 background：linear-gradient(位置，颜色。。。) background:repeating-linear-gradient(位置，颜色1 起始，颜色1 结束，颜色2 起始，颜色2 结束) 颜色2的起始是颜色1的结束径向渐变 background:radial-gradient(位置，颜色。。。) background：repeating-radial-gradient(位置，颜色1起始，颜色1结

2022-01-10 15:01:58 737

原创 day15

1 结构伪类选择器这个结构中：第一个 first-child 第几个 nth-child(n) 倒数第几个 nth-last-child(n) 最后一个 last-child 只有一个 only-child 这个元素类型第一个 first-of-type 第几个 nth-of-type(n) 倒数第几个 nth-last-of-type(n) 最后一个 last-of-type 只有一个 only-of-type 内容为空 empty 2 否定伪类选择器：not（） 3

2022-01-10 14:29:07 265

原创 day14

1 新增布局布局标签头部 header 导航nav 内容selection，main 底部footer 侧边栏aside 文章 artical 标题组 hgroup 媒体组 figure 媒体组标题 figcaption 时间time 选中mark 2 其他标签 details 定义详细信息 summary 更改详细信息的内容注释标签 ruby rp rt 3 视频音频视频 video 支持格式MP4 ogg webm 音频 audio 支持格式 MP3 MP4 ogg 静音 mu

2022-01-09 21:47:30 291

原创 day 13

1 高度塌陷：父元素设置了高度，子元素设置了float 解决方式： 1 外墙法：在塌陷的父元素后边添加一个空div，设置clear：both 可以解决塌陷问题，但是父元素的高度依然没有 2 内墙法：在浮动的元素后边添加一个空div,设置clear:both 可以解决塌陷，同时让父元素存在高度 3 给父元素添加overflow属性，hidden、scroll、auto，必须要保证内容不存在溢出 4 伪元素选择器父元素：after { content： " "; display: bloc

2022-01-02 12:14:57 207

原创 day12

1 html的兼容 lte 小于等于 gt大于 lt小于 gte 大于等于 css的兼容 IE6以下不支持子代选择器属性前边添加下划线，IE6以下支持属性前边添加*，IE7以下支持 \9 IE10以下支持 \0 IE8以上支持 2 常见浏览器兼容问题 1 图片会向下撑大3个像素解决方式：1给图片添加vertical-align:top/middle/bottom 2 给图片添加display：block 3 给父元素添加font-size:0 2 超链接出来的图片，在ie10以

2022-01-01 20:38:39 285

原创 day11

1 水平垂直居中单行文本、多行文本、行内元素、行内块水平方向居中 text-align:center 垂直方向居中高度固定、单行文本、line-height 多行文本通过计算行内块 vertical-align：Middle 高度不固定：单行文本、多行文本、行内块、行内元素、块级元素 padding 块级元素水平方向居中：margin:0 auto 利用表格可以很快实现水平垂直居中，不分元素 2 定位属性 static 默认值，静态的 relative 相对定位，是在原来位置上的

2021-12-30 17:50:06 205

原创 day10

1 背景相关属性（背景颜色和背景图片可以同时存在，背景图片会盖住背景颜色） background 复合属性：颜色、图片、图片的重复方式、图片的位置、是否固定 background-color 颜色 background-image 图片 url（路径）背景图片如果比元素本身大，则只显示元素本身大小的的背景图片，从背景图片的左上角开始加载，超区的不显示，背景图片如果比元素本身小，则会水平垂直平铺，直到铺满整个元素的区域。 background-repeat repeat默认值，no-repea

2021-12-29 19:56:18 224

原创 day09

1 margin的塌陷第一个元素的margin-top与最后一个子元素的margin-bottom会传递给父元素解决办法： 1给父元素添加overflow:hiddden属性 2 给父元素添加border 3 给父元素添加padding 4 给父元素添加 float 5 给元素本身添加float 6 给元素本身添加display：inline-block 7 不让他是第一个元素或者最后一个元素 2 overflow: over-x 水平方向 over-y 垂直方向 hidden

2021-12-28 13:57:10 223

原创 day08

1 盒子模型 1 组成： margin border padding content（width、height） 2 padding 内填充、内边距、内补白 padding 会撑大盒子，padding区域可以出现背景颜色，（不能出现负值）在边框线里边一个值代表上下左右，两个值代表上下、左右，三个值代表上、左右、下，四个值代表上、右、下、左（顺时针）可以单独设置某一个方向：padding-left、right、top、bottom 3 margin 外填充、外边距、外补白 margin会撑

2021-12-24 20:57:02 487

原创 day 07

1 文本相关属性 1 字符间距 letter-spacing (可设置负值) 2 词间距 word-spacing （可设置负值） 3 文本修饰 text-decoription:underline 下划线 overline 上划线 line-through 删除线 none 没有 4 英文字母大小写 text-transform: uppercase 大写 lowercase 小写 capitalize 首字母大写 5 首行缩进 text-indent 首行缩进2个字，值是2em，只针对第一行生

2021-12-23 20:55:34 250

空空如也

空空如也