diff --git "a/\344\277\235\345\255\230/6.27HTML\346\240\207\350\257\206.md" "b/\344\277\235\345\255\230/6.27HTML\346\240\207\350\257\206.md" new file mode 100644 index 0000000..6e88f62 --- /dev/null +++ "b/\344\277\235\345\255\230/6.27HTML\346\240\207\350\257\206.md" @@ -0,0 +1,44 @@ +第一天笔记本 《标签》 + +head下面 + +base技巧 target=“—blank” + +![1561622184201](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561622184201.png) + +锚点 + +设置锚点id=“abc” + +回到锚点 a href=“#abc” + +strong b 加粗 + +em i 斜体 + +del s 删除 + +ins u 下滑 + +p 段落 + +br 换行 + +hr 横线 + +img 图片 + +  空格 + +> 尖括号右 + +< 尖括号左 + +shift+/ 补充标签 + +h 标题标签 + + ![1561637264713](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561637264713.png) + +

+ diff --git "a/\344\277\235\345\255\230/6.28HTML\350\241\250\346\240\274.md" "b/\344\277\235\345\255\230/6.28HTML\350\241\250\346\240\274.md" new file mode 100644 index 0000000..17c3813 --- /dev/null +++ "b/\344\277\235\345\255\230/6.28HTML\350\241\250\346\240\274.md" @@ -0,0 +1,41 @@ +![1561640982194](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561640982194.png) + +![1561686730370](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561686730370.png) + +![1561689015685](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561689015685.png) + +![1561704408058](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561704408058.png) + +属性对于密码输入框都有用 + +![1561704977466](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561704977466.png) + +checked=checked + + 默认选项 + +![1561705984857](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561705984857.png) + +![1561706176933](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561706176933.png) + +![1561706261693](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561706261693.png)文本上传 + +![1561706548460](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561707855136.png) + +作用是for=input id属性值 绑定当点击label内容是 会获取光标焦点 + +![1561709045669](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561709045669.png) + +表单name 是多个表单传递的凭证 + +![1561709343508](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561709343508.png) + +传递信息的方法 + +在form内填写 + +![1561710129593](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561710129593.png) + + \ No newline at end of file diff --git "a/\344\277\235\345\255\230/6.30CSS\345\237\272\347\241\200.md" "b/\344\277\235\345\255\230/6.30CSS\345\237\272\347\241\200.md" new file mode 100644 index 0000000..f2bd885 --- /dev/null +++ "b/\344\277\235\345\255\230/6.30CSS\345\237\272\347\241\200.md" @@ -0,0 +1,37 @@ +微软雅黑 Microsoft YaHei \5FAE\8F6F\96C5\9ED1 + +宋体 SimSun \5B8B\4F53 + + + +数字 400 等价于 normal,而 700 等价于 bold。 但是我们更喜欢用数字来表示。{字体加粗用CSS实现} + +一个标签可以调用多个类选择器 + +![1561876266198](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561876266198.png) + +![1561876394355](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561876394355.png) + +让题目不加粗 + +![1561876618529](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561876618529.png) + +![1561877024955](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561877024955.png) + +![1561877613705](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561877613705.png) + +![1561879131011](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561879131011.png) + +1em相当于一个汉字的大小 + +#### 10.p父代选择器 + +![1561882234448](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561882234448.png) + +子代选择器 + +## 11.并集选择器 + +![1561884927175](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561884927175.png) + +相邻选择器 必须是并列关系 必须为紧挨着的元素 \ No newline at end of file diff --git "a/\344\277\235\345\255\230/7.16CSS\345\212\250\347\224\273.md" "b/\344\277\235\345\255\230/7.16CSS\345\212\250\347\224\273.md" new file mode 100644 index 0000000..75d6ad1 --- /dev/null +++ "b/\344\277\235\345\255\230/7.16CSS\345\212\250\347\224\273.md" @@ -0,0 +1,38 @@ +![1563241306861](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563241306861.png) + +2D转换的优势和特点 + +1.放大{倍数 不加单位}缩小取值范围0 到1;设置一个值时 宽高等比例缩放 + + + +![1563244545033](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563244545033.png) + +![1563247422163](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563247422163.png) + + + +动画 + +![1563247877707](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563247877707.png) + +必须设置持续的时长才可以; + +![1563249062768](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563249062768.png) + +![1563249220967](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563249220967.png) + +前两个 顺序 必须按顺序 其余的随便, + +2.多状态动画 + +![1563259752265](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563259752265.png) + +![1563262269652](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563262269652.png) + +![1563265116105](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563265116105.png) + +使用Z轴时 必须配合 给上级元素设置perspective(视距):像素值;z轴不变 视距越大 物体越小 + +视距不变 z轴越大 物体越大 + diff --git "a/\344\277\235\345\255\230/7.17CSS\346\265\201\345\274\217\345\270\203\345\261\200.md" "b/\344\277\235\345\255\230/7.17CSS\346\265\201\345\274\217\345\270\203\345\261\200.md" new file mode 100644 index 0000000..cb0ae9a --- /dev/null +++ "b/\344\277\235\345\255\230/7.17CSS\346\265\201\345\274\217\345\270\203\345\261\200.md" @@ -0,0 +1,19 @@ +![1563414049423](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563414049423.png) + +# 1.像素 + +## 2.流式布局的特点是 宽度随屏幕缩放 但是 高度不会改变设置好屏幕最大和最小的缩放尺寸 + + + +![1563418366163](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563418366163.png) + +解决方案: 设计素材人员,设计图片时 多倍设计。 + +![1563419837756](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563419837756.png) + +![1563439359615](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563439359615.png) + +![1563451407954](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563451407954.png) + +设置移动端 图片一行显示是 流式布局中 按百分比 给a 设置大小 并浮动 使其一行显示 这样会出现的情况是 图片会变得很大 层叠起来 需要给图片 设置宽度为百分之百 则在a内全部显示。 \ No newline at end of file diff --git "a/\344\277\235\345\255\230/7.19Flex\345\270\203\345\261\200.md" "b/\344\277\235\345\255\230/7.19Flex\345\270\203\345\261\200.md" new file mode 100644 index 0000000..e69de29 diff --git "a/\344\277\235\345\255\230/7.1CSS.md" "b/\344\277\235\345\255\230/7.1CSS.md" new file mode 100644 index 0000000..fa6cb6d --- /dev/null +++ "b/\344\277\235\345\255\230/7.1CSS.md" @@ -0,0 +1,31 @@ +![1561951418628](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561951418628.png) + +![1561951435225](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561951435225.png) + +![1561952299035](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561952299035.png) + +![1561953484002](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561953484002.png) + +背景属性连写 + +![1561963037185](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561963037185.png) + +文本居中完全可以当做文字居中 + + + +技巧![1561964296895](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561964296895.png) + +![1561966763955](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561966763955.png) + +![1561967525671](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561967525671.png) + + + +![1561968129370](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561968129370.png) + +# 1.熟练使用 + +![1561970826473](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561970826473.png) + +![1561971762101](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1561971762101.png) \ No newline at end of file diff --git "a/\344\277\235\345\255\230/7.21rem\345\270\203\345\261\200.md" "b/\344\277\235\345\255\230/7.21rem\345\270\203\345\261\200.md" new file mode 100644 index 0000000..0d63455 --- /dev/null +++ "b/\344\277\235\345\255\230/7.21rem\345\270\203\345\261\200.md" @@ -0,0 +1,78 @@ +1em=父亲字体的大小 + +只要用到em子元素都有效 + +只能在父元素下面受控制 + +#### rem + +root指html的font-size大小, + +形成绝对唯一控制 设置在html上。 + +吧px换成rem 可以控制等比变化 + + + +![1563673771360](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563673771360.png)三种方案 + +1.padding值加定位(pc端) + +2.flex设置(移动端) + +3.margin值加定位{宽度不设置 设置margin值会往中间挤} + +媒体查询 + +查询屏幕的变化 + + + +less语法中 + +@开头是变量 【@color:red; + +嵌套关系 + +![1563680132423](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563680132423.png) + +伪类 等{&代表自己}写在括号内 + +​ 接着写卸载a下面 括号外 + +![1563680201629](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563680201629.png) + +运算 + +![1563680386644](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563680386644.png) + +两个不同单位取第一个单位; + +![1563691439910](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563691439910.png) + +rem布局缺点: + +​ 挡位划分不够细 所以会发生 不流畅变化 + +js + +​ 默认划分10份 + +​ 变化一次 计算一次 + +引用 JS时 + +![1563701143491](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563701143491.png) + +![1563701255350](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563701255350.png) + +权重不够 行内的没有文件权重高 所以需要提权 加!improtent + +rem布局:rem+flexible.js 连续变化;用户友好体验; + +- 第二步: + - **准备各个档位下的rem**:这个不需要准备,JS帮我们实现每个屏幕都有自己的font-size + - **拿到当前设计稿下的1rem代表多少PX值**:因为我现在是750px的设计稿,所以可以得到750px这个尺寸属于的档位下的HTML 的font-size大小,也就是750px设计稿下的1rem值。 + - **计算比例**:把页面刚才所有的元素的PX值替换为 rem 比例值;(82px 想转换成多少rem ,75px = 1rem 82rem/75); + - **达到目标**:那么,屏变化时,1rem(基础块)也会变化,自然就是等比缩放; + diff --git "a/\344\277\235\345\255\230/7.22\345\223\215\345\272\224\345\274\217\345\270\203\345\261\200.md" "b/\344\277\235\345\255\230/7.22\345\223\215\345\272\224\345\274\217\345\270\203\345\261\200.md" new file mode 100644 index 0000000..5ce6664 --- /dev/null +++ "b/\344\277\235\345\255\230/7.22\345\223\215\345\272\224\345\274\217\345\270\203\345\261\200.md" @@ -0,0 +1,38 @@ +# 1.bookstrap(初始化样式) + +![1563762156687](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563762156687.png) + +下面的js是对ie浏览器的不支持 做兼容。 + +这个js里面有预制好的样式 直接掉类名就可以。 + +不设置宽度 margin值设置会向内压缩;但如果margin设置成负值;则向外扩展。 + +## 2.栅格 系统 (重要) + +![1563764329993](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563764329993.png) + +## 3.控制显示 和隐藏 + +![1563765987257](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563765987257.png) + +![1563767325350](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563767325350.png) + +![1563785195489](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563785195489.png) + + + +更换挡位时 图片还是原来的大小 + +第一步: + +![1563787946807](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563787946807.png) + +第二步 + +![1563786616310](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563786616310.png) + +第三步 + +![1563787498877](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563787498877.png) + diff --git "a/\344\277\235\345\255\230/7.24js\345\237\272\347\241\200\344\270\200.md" "b/\344\277\235\345\255\230/7.24js\345\237\272\347\241\200\344\270\200.md" new file mode 100644 index 0000000..9591ae9 --- /dev/null +++ "b/\344\277\235\345\255\230/7.24js\345\237\272\347\241\200\344\270\200.md" @@ -0,0 +1,173 @@ +# js + +告诉浏览器要定义一个变量 var 使用`=`号告诉浏览器,我们要把**左边的数据存储**到**变量(单词)**里面;直接参加我们需要的计算; + +1.输入:prompt("提示") + +2.输出:alert(“警告,警示”) + +3.console。log(控制台) + +4.页面输出:documen。write() + +![1563936640767](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563936640767.png) + +## 转换 + +### 1.转数字 + +1.number(a) + +转为数字 + +或者NAN; + +任何都能转成数字 + +2.var a='10.1abx'{只能接受字符串 其余类型不可以 要转成功 只能输出整数} + +console.log(a ,parselent(a)) + +输出为10 + + + +​ + + 字符类型 数字只能写在前面 而且只能显示整数 + +3.parseFloat()'{只能接受字符串 其余类型不可以 要转成功 只能输出小数} + +var a="10.1abc" + +console.log(a ,parseFloat(a)) + +输出为10.1 + + + +字符类型 数字只能写在前面 而且只能显示小数 + +## 2.转字符串 + +特点 效果就是数据两边加一个单或者双引号 + +语法:string(); + + .toString() + +## 3.转不尔类型 + +![1563950847802](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563950847802.png) + +![1563950936298](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563950936298.png) + +#### 有6种情况可以转为false + +underfined + + 0 + + NaN + + null + + "" + +undfin false + +## 算数操作符 + +只要字符串遇见+;确认参与运算 + +字符串转换如果为字的话 则转换为NaN + +要求是数字类型 + +不是数字类型,隐式转化过程; + +![1563952379211](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563952379211.png) + +## a++和++a两种类型 + +a++=2; + +a++ +1=2 + +(a+1)运算结果赋值给b + +++a +1=3 + +++写在前面的话 先进行运算 在自增 + +++写在后面的话 先自增 再进行运算 + + + +![1563954784369](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563954784369.png) + +## 比较运算符 + +![1563956022989](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563956022989.png)字符串 + +2.boolean 输出时false的情况 + +var a=true>0; + +true + +3.null + +var a=null>6; + +false + +### == != + +先看类型 + +若类型相同;比值 + +如类型不同;隐式转换 数字类型a + +![1563956586527](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563956586527.png) + +输出结果为 false. + +### === !== + +先看类型 + +如果类型相同 比值, + +如果类型不同,直接false + +## 逻辑操作符 + +&&且,全部满足 + +返回;把最后一个满足的结果 返回来; + +console.log(true&& true); + +返回true + +当不满足时 直接就把不满足的结果返回; + +console.log(false&& true); + +当遇到非布尔值,转换为布尔值参与逻辑判断 + + + +console.log(1&& 2); + +返回的是2 + +返回值时原来位置上的数据. + +![1563958271213](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563958271213.png) + +### ![1563958285028](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563958285028.png) + +**![1563959350803](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1563959350803.png)** \ No newline at end of file diff --git "a/\344\277\235\345\255\230/7.25js\345\237\272\347\241\200\344\272\214.md" "b/\344\277\235\345\255\230/7.25js\345\237\272\347\241\200\344\272\214.md" new file mode 100644 index 0000000..9bba99e --- /dev/null +++ "b/\344\277\235\345\255\230/7.25js\345\237\272\347\241\200\344\272\214.md" @@ -0,0 +1,71 @@ +运算符(隐式转换)不用更改 + +![1564016822627](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564016822627.png)![1564017105675](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564017105675.png) + +# 1.day2 + +1.表达式 有个输出的返回值就是表达式。 + +2.语句 console。log(); + +浏览器返回 undefind; + +# 2.分支结构 + +## 1.if本质是判断是否执行为true如果是 则不再往下走 直接输出当前大花括号内的代码 后面不再执行 + +1.if标签 + +var sex=prompt() + +conso.log(sex) + +if (sex=="男"){ + +alert=“这是个男人” + +} + +![1564018706093](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564018706093.png) + +2.else + +3.if-else-if + +#### 字符串的应用场景(字符串+的最常用场景 应用) + +![1564019390574](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564019390574.png) + + + +## 2.switch-case结构 + +![1564021395463](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564021395463.png) + +不是的话 就往下走 是的话 直接break(打断) + +default(不是必须的)都不是时 输出一个东西结束。 + +### 3.三元表达式 + +语法:var =表达式1?表达式2:表达式3; + +相当于if else的简写。 + +# 3.循环结构 + +### 1.while循环 + +条件表达式是true时 是死循环, + +![1564024678377](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564024678377.png) + +### 2.for循环 + +![1564042769304](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564042769304.png) + +里面的for循环执行完成之后 在可以执行 外面的循环; + +![1564042910758](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564042910758.png) + +break满足条件时 if (满足条件)直接跳出循环 6 \ No newline at end of file diff --git "a/\344\277\235\345\255\230/7.26js\346\225\260\347\213\254.md" "b/\344\277\235\345\255\230/7.26js\346\225\260\347\213\254.md" new file mode 100644 index 0000000..2bea3a1 --- /dev/null +++ "b/\344\277\235\345\255\230/7.26js\346\225\260\347\213\254.md" @@ -0,0 +1,57 @@ +# -----数组----- + +语法格式;var arr(是个定义 随便是什么都可以)=[]; + +数组的长度:数组内的数据个数, + + + +![1564195453806](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564195453806.png) + +0到不了arr.length + +所以可以用 + +![1564195579926](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564195579926.png) + + + +清空数组:arr.length=0;结束了让数组变为0。 + +while循环 输入true 一直循环 + +写退出循环的时候 不能用switch循环, + +![1564210554322](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564210554322.png) + +## 2.字符串转数组 + +![1564211960127](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564211960127.png) + +1.分隔符返回的是一个数(数据)组 + +var a=str.split("");a就是定义一个变量 后面是转为数组 + +如果数组里都是数字 求和 + +2.构造函数 返回一个我们需要的东西 + +先定义一个函数: + +var date=new Date(); + +有关时间一个工具 + +![1564216679740](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564216679740.png) + +3.随机数 + +js获取随机数 + +var r=Math.randow(), + +随即范围 小数 包括0-1 数学上的写法[0,1) + +所以我们先搞清楚我们需要的索引值是什么范围 + +比如7个索引值 则写*7, \ No newline at end of file diff --git "a/\344\277\235\345\255\230/7.28js\345\260\201\350\243\205\345\207\275\346\225\260.md" "b/\344\277\235\345\255\230/7.28js\345\260\201\350\243\205\345\207\275\346\225\260.md" new file mode 100644 index 0000000..3d5594e --- /dev/null +++ "b/\344\277\235\345\255\230/7.28js\345\260\201\350\243\205\345\207\275\346\225\260.md" @@ -0,0 +1,116 @@ +s![1564277837208](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564277837208.png) + +# 函数 + +## 1.配置参数 + +![1564278362356](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564278362356.png) + +![1564278440840](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564278440840.png) + +![1564278526783](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564278526783.png) + +从上到下传入过程 + +配置两个或者以上变量 + +![1564278951635](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564278951635.png) + +传入赋值 不传入 默认为undefind + +所以为了更严谨的写法 + +判断一下写的变量是否忘写或者是u'n'de'find + +![1564279407178](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564279407178.png)写在 undefand上 + +![1564279882224](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564279882224.png) + +false直接输出的是三元表达式里的第三个表达式 + +true的话输出的是三元表达式里的第二个表达式 + +## 形参和实参 + +形参 形式上先参与函数内部逻辑的一些参数;没有调用时不知道要传入什么 + +实参 真是传入的这些数据 可以直接传入数据 也可以传入外面已经定义好的变量 + +形参和实参在要传入的简单数据类型,相互不影响 + +## 函数-返回值 + +返回值 return + +目前把多个值返回 可以用一个数组return + +## 函数表达式 + +![1564296193518](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564296193518.png) + +另外一种方法声明函数 + +## 匿名函数 + +js不允许匿名函数单独使用 需配合其他使用 fn函数类型 + +自执行函数(页面打开自动执行) + +![1564296534151](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564296534151.png) + +自执行函数吧前面当成一个整体 + +回调函数 + +![1564297182504](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564297182504.png) + +只要函数有实参 这个函数就叫回调函数 + +只要调用的里面有实参 就是回调函数 + +## 作用域 + +全局作用域 + +全局变量 在你声明的这个作用域内 任何地方都可以访问 + +![1564297628591](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564297628591.png) + +局部作用域 声明函数内部的范围 + +![1564297707092](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564297707092.png) + +## **预解析** + +变量在任何地方都可以 吧初始化的声明的变量函数提前放到最顶端 + +声明变量 var a + +声明函数 + +赋值的过程 + +如果是var a=function(){}则吧a提升上去 而不是 整个函数 + +然后再开始从上到下开始执行 + +![1564299076406](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564299076406.png)先把变量提升 到最上面 var num + +然后是函数提升到最上面 + +然后下面 是 + +num=10 + +fun() + +按这个顺序执行完毕后 最后一个是fun() + +进入内部函数 + +一样先把var num提升到函数内的最上面 + +下面是var num + +console.log(num) 不是一个确定的数 所以输出的是undefined + diff --git "a/\344\277\235\345\255\230/7.30js\345\237\272\347\241\200\345\257\271\350\261\241.md" "b/\344\277\235\345\255\230/7.30js\345\237\272\347\241\200\345\257\271\350\261\241.md" new file mode 100644 index 0000000..fd522ba --- /dev/null +++ "b/\344\277\235\345\255\230/7.30js\345\237\272\347\241\200\345\257\271\350\261\241.md" @@ -0,0 +1,121 @@ +# 对象 + +不是内置对象的话 需要用构造函数创造一个对象、 + +构造函数创建数组 + +​ + +var arr =new Array(内置的数组) + +var arr_1=[ ]; + +## 创建对象 + +### 1.构造函数 + +var obj = new Object(内置的对象) + +### 2.字面量方向 + +var obj={ } + +## 添加属性(对象是属性和方法的集合体) + +1.声明变量 + +var obj={ } + +var obj={} + +2.添加属性() + +对象.属性的名称=属性值(特征的值) + + + +obj.name="名字" + +3.添加方法 + +语法 对象.方法名=function(匿名函数) + +obj就相当于对象 我们吧方法名以及后面的函数写好一个自己要用的新方法 挂载在原先的obj上就可以在他功能的基础上添加新的 方法, + +obj.say_name=function(){ + + + +} + +调用的时候必须带上obj.是一个整体 + +函数调用才会执行 不调用 不会执行 + +### 2.连写 + +![1564454876427](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564454876427.png) + +另一种方法 键值对的方法: + +这种方法对象中括号里 必须是一个string类型 + +obj[“‘name]="名字" + +对象[“属性名”] + +## 获取 + +1.点方式获取 + +2.键的方式获取 + +obj["name"]="三哥"、 + +obj.name="三哥" + +获取的时候可以 随意 可以混用 + +![1564456174196](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564456174196.png) + +## 对象遍历 + +就是吧对象里的属性一个一个过一遍 + +​ 变量 + +key 泛指 对象上的键值对的上的键 + +for(var key in obj){ + +console .log(key) + +} + +补充 打印一个对象没有的属性名,返回的值是underfined + +1.![1564456712324](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564456712324.png) + +2. + +![1564456910330](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564456910330.png) + +不能加”“ + +打印key 是键值的名字 + +打印 obj[key]属性名后的值 + +### 往 math上挂载一个随机n到m的随机数 以后在原生js上可以直接挂载你拓展的方法 + +![1564474892220](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564474892220.png) + +## 数组的拼接 + +语法 + +![1564476075941](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564476075941.png) + +arr.concat内部是一个argunment获取到的 + +![1564477689049](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564477689049.png) \ No newline at end of file diff --git "a/\344\277\235\345\255\230/7.31\345\270\270\347\224\250\345\206\205\347\275\256\345\257\271\350\261\241.md" "b/\344\277\235\345\255\230/7.31\345\270\270\347\224\250\345\206\205\347\275\256\345\257\271\350\261\241.md" new file mode 100644 index 0000000..8291fc6 --- /dev/null +++ "b/\344\277\235\345\255\230/7.31\345\270\270\347\224\250\345\206\205\347\275\256\345\257\271\350\261\241.md" @@ -0,0 +1,136 @@ +![1564540188216](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564540188216.png) + +时间戳 + +![1564540451666](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564540451666.png) + +## Array*****重要**** + +push 从数组后面添加数据,参与为单个或多个(逗号隔开) + +返回值:新数组的长度 + +pop从后面删除数据 + +返回:被删除的数据 + +unshift 从数组前面添加数据 返回值是新数组的长度 + +shift 从前面删除数据 + +返回:被删除的数据 + +splice 从任何位置的增添改 + +返回值 被移除的数组 + +语法 arr.splice(n,m) + +1.第一个参数是下标 第二个参数是被删除的数量 + +arr.splice(n,m,) + +2.arr.splice(n,0,"ds","as") + +第二个参数 删除0个 + +从下表三的为止,添加后面的数据 + +![1564541487703](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564541487703.png) + +3.arr.splice(n,m,w) + +就是从第n个开始删除m个然后添加w到删除的位置 + +## 分隔符 + +数组转为字符串 + +![1564543913725](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564543913725.png) + +字符串转为数组 var sta = sta.split(",") + +判断当前数据在不在当前数组内 + +![1564544256068](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564544256068.png) + +可以找满足大于某个条件下的第一个值的下标 + +当没有满足的条件时 返回-1 + +![1564544520384](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564544520384.png) + +## 遍历数组*最为常用* + +基础语法 + +![1564555162656](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564555162656.png) + +item代表当前遍历的一个数据 + +index 当前数据的下标 + +arr 当前的数组 + +## 数组过滤 + +语法 + +![1564555575943](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564555575943.png) + +return后面是写一个条件表达式 需要返回一个boolearn值 + +当结果为true时 把符合条件的数据返回 返回的是item到新数组里 直接定义一个变量接收就可以了。 + +## 数据拼接 + +var arr=[1,2,3,4] + +var res = arr.concat("as","sad") + +拼接不操作原数组 多个变脸拼接 也不会影响原数组 只会把拼接后的结果变成一个新数组返回 + +## 截取 + +splice操作原数组 + +slice截取数组,不对原数组操作 返回值是新的数组、 + +var arr=["a","b","c"] + +var res = arr.slice(n,m)包左不包右 + +1.第一个参数 截取的左下标 + +第二个参数 截取的右左标 + +2.如果只设置一个 默认为数组的长度 + +3.两个参数全部省略 第一个默认为0 第二个默认为长度 + +## 数组复制 + +复制 + +![1564559667597](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564559667597.png) + +## 对象的浅拷贝 + +![1564560246871](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564560246871.png) + +#### 3 + +#### 字符串的不可变性 字符串会被新的字符串代替 但是旧的字符串不会消失 会存在内存里 + +## 字符串拼接 + +concat拼接 返回一个新的字符串 + +substring=slice区别是slice可以设置负数 + +### string截取 + +1.第一个为下标 第二个是个数 + +![1564565088691](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564565088691.png) + diff --git "a/\344\277\235\345\255\230/7.3CSS\347\233\222\345\255\220\346\250\241\345\236\213.md" "b/\344\277\235\345\255\230/7.3CSS\347\233\222\345\255\220\346\250\241\345\236\213.md" new file mode 100644 index 0000000..582bdf8 --- /dev/null +++ "b/\344\277\235\345\255\230/7.3CSS\347\233\222\345\255\220\346\250\241\345\236\213.md" @@ -0,0 +1,28 @@ +![1562118600774](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562118600774.png) + +### 只能用在 表格上 + +![1562120561658](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562120561658.png) + +![1562121878550](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562121878550.png) + +![1562125565674](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562125565674.png) + +设置宽度的块元素 才可以用magin=auto 居中 + +![1562137996870](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562137996870.png) + +![1562139687971](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562139687971.png) + +![1562139900345](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562139900345.png) + +垂直方向块元素合并 + +![1562145666551](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562145666551.png) + +写两个值 用椭圆切 + +border-radius:40px 50px 两个值 是上下40 左右50 + +三个值是 上左右下 + diff --git "a/\344\277\235\345\255\230/7.4CSS.md" "b/\344\277\235\345\255\230/7.4CSS.md" new file mode 100644 index 0000000..6096a6a --- /dev/null +++ "b/\344\277\235\345\255\230/7.4CSS.md" @@ -0,0 +1,16 @@ + + +![1562204055179](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562204055179.png) + +多组阴影 逗号隔开 + +![1562204428790](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562204428790.png) + +opacity控制元素整体透明度 包括 所有子元素取值范围0-1 0.5的0可以省略掉 + +![1562210973148](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562210973148.png) + +![1562230700178](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562230700178.png) + +大广告 下面区域 + diff --git "a/\344\277\235\345\255\230/7.6css3.md" "b/\344\277\235\345\255\230/7.6css3.md" new file mode 100644 index 0000000..25d3bce --- /dev/null +++ "b/\344\277\235\345\255\230/7.6css3.md" @@ -0,0 +1,44 @@ +recommend 推荐 + +清除浮动父元素不能设置高度 里面附佛那个的资源数不能撑开父元素高度的问题 + +overflow:hidden;(给影响浮动的父元素设置) + +弊端 如果子元素出了父元素的边界 会溢出隐藏 + +3.伪元素清除浮动 + +伪元素相当于行内元素 + +![1562383985526](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562383985526.png) + +![1562384086403](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562384086403.png) + +![ + +1562384367702](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562384367702.png) + +![给1562384760053](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562384760053.png) + + + +给父元素 设置 、(常用) + +![1562398202868](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562398202868.png) + +![1562399359685](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562399359685.png) + +![1562399596786](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562399596786.png) + +![1562400066166](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562400066166.png) + +bd+ + +子绝父相浮动定位 相对定位 固定定位 都脱标 托表就会有行内块的显示特点 + +![1562403547725](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562403547725.png) + +![1562404690418](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562404690418.png) + +脱标时 必须设置宽度 才可以显示出来 + diff --git "a/\344\277\235\345\255\230/7.7CSS.md" "b/\344\277\235\345\255\230/7.7CSS.md" new file mode 100644 index 0000000..f6a31d1 --- /dev/null +++ "b/\344\277\235\345\255\230/7.7CSS.md" @@ -0,0 +1,45 @@ +![1562467710589](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562467710589.png) + +![1562468740848](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562468740848.png) + +display:none;隐藏之后不占位置 + +visibility:hidden;隐藏之后占位置 + +![1562470013456](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562470013456.png) + +溢出的内容不占位置 + +![1562470557811](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562470557811.png) + +![1562470915512](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562470915512.png) + +![1562471366154](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562471366154.png) + +想实现单行文本一行显示 单行文本省略号 三个缺一不可 + +![1562481491340](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562481491340.png) + +只对行内元素 行内块元素有效果 + + + +![1562489243940](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562489243940.png) + +![1562489546546](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562489546546.png) + +-- + +-+++++++++++++.0 + +![1562489727800](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562489727800.png) + +![1562489965215](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562489965215.png) + +占位符 placeholder 输入内容的时候 占位符消失 删除文字时占位符显示 + +占位符选择器a::placeholder + +![1562491047049](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562491047049.png) + +![1562491118473](C:\Users\Mr.Chen\AppData\Roaming\Typora\typora-user-images\1562491118473.png) \ No newline at end of file diff --git "a/\344\277\235\345\255\230/7.9CSS.md" "b/\344\277\235\345\255\230/7.9CSS.md" new file mode 100644 index 0000000..d344f04 --- /dev/null +++ "b/\344\277\235\345\255\230/7.9CSS.md" @@ -0,0 +1,61 @@ +网站优化 + +1.网站名字 + +2.网站描述 + +3.网站关键字 {}相当于function + + setTimeout(() => { + +​ + +​ }, timeout); + +clearTimeout清除定时器 + +## 永久定时器 + +返回值是一个id值 就是为了停止定时器 + +不是一瞬间执行 等待1000ms后,开启你的定时器 + +![1564992726467](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564992726467.png) + + + +返回值是刚才的数据 就等于是张三 + +![1564992709044](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564992709044.png) + + + +删除刚才的数据从浏览器删除 + +![1564992917206](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564992917206.png) + +移除 dom节点 removeChild + +// 父元素.removeChild(要删除的子元素); + +var first = ul.children[0]; +// 调用方法,移除 +ul.removeChild(first); + +# JOSN + +有一定格式的字符串 可以将对象复杂类型转为字符串 + +![1564993540374](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564993540374.png) + +把对象类型转为JOSN格式的字符串 + +![1564994307166](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564994307166.png) + +吧对象转为JOSN格式的字符串 后台存储的时候格式只能是字符串 + + + +![1564994364306](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564994364306.png) + +![1564996620069](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1564996620069.png) + +要把新的一条数据 改变的东西抽象为一个对象 格式应该和之前预定好的一样添加到全局的数组里 \ No newline at end of file diff --git "a/\344\277\235\345\255\230/8.8dom\346\224\276\345\244\247\351\225\234.md" "b/\344\277\235\345\255\230/8.8dom\346\224\276\345\244\247\351\225\234.md" new file mode 100644 index 0000000..1fead7e --- /dev/null +++ "b/\344\277\235\345\255\230/8.8dom\346\224\276\345\244\247\351\225\234.md" @@ -0,0 +1,6 @@ +![1565252245830](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1565252245830.png) + +client可视区域的内容 + + + diff --git "a/\344\277\235\345\255\230/8.9\347\247\273\345\212\250\347\253\257\345\272\223.md" "b/\344\277\235\345\255\230/8.9\347\247\273\345\212\250\347\253\257\345\272\223.md" new file mode 100644 index 0000000..1561f32 --- /dev/null +++ "b/\344\277\235\345\255\230/8.9\347\247\273\345\212\250\347\253\257\345\272\223.md" @@ -0,0 +1,32 @@ +# 移动端库 + +## 事件 + +* touchstart触摸到屏幕时触发 +* tuochmove会在触摸到屏幕移动的过程中触发 +* thouchend会在手指离开屏幕的瞬间触发 + +## Zepto移动端类库 + +var box =$(类名);返回一个为数组 相当于queselekterAll + +注册事件 + +### .on已经封装好 不用关心其他的 + +这个可以直接将box这个数组注册事件 不用循环遍历 + +box.on("click",function(){ + +}) + +### 为数组下面的所有节点样式改变 + +box.css("width","500px");所有的数组内的内容都会改变 + +box.width("")可以获取宽度也可以直接设置 + +### 操作dom节点(添加一个新的标签用于抽象数据的时候使用 简便写法) + +box.append(`${}`) 操作每一个东西都添加上 + diff --git "a/\344\277\235\345\255\230/9.1 ES6\345\257\273\346\211\276\346\225\260\347\273\204\344\270\255\347\232\204\346\234\200\345\244\247\345\200\274.md" "b/\344\277\235\345\255\230/9.1 ES6\345\257\273\346\211\276\346\225\260\347\273\204\344\270\255\347\232\204\346\234\200\345\244\247\345\200\274.md" new file mode 100644 index 0000000..4f78669 --- /dev/null +++ "b/\344\277\235\345\255\230/9.1 ES6\345\257\273\346\211\276\346\225\260\347\273\204\344\270\255\347\232\204\346\234\200\345\244\247\345\200\274.md" @@ -0,0 +1,45 @@ +# ES6寻找数组中的最大值 + +之前的方法: + +1.循环遍历 + +2.let max=Math.max.apply(null,arr) + +改变this指向, + +3.let max =Math.max(...arr) + +## 将伪数组转成数组 + +伪数组本质是一个对象 + +obj={ + +} + +let arr =Array.form(obj) + +### 2.查找值和索引 finde(),findIndex() + +## Number + +parseInt()在ES6中 是Number下的方法,直接调用即可 + +## set + +类似于数组 + +实例化set的时候,可以为其传递一个值(字符串或者数组) + +set内的成员不可以重复 + +#### -----------------------------可以去重-------------------------------------------------- + +## global + +require(路径) 可加载其他js文件或者json文件 + +自动转换为js数组 + + diff --git "a/\344\277\235\345\255\230/9.10vue\347\254\254\344\272\214\345\244\251.md" "b/\344\277\235\345\255\230/9.10vue\347\254\254\344\272\214\345\244\251.md" new file mode 100644 index 0000000..f4ec429 --- /dev/null +++ "b/\344\277\235\345\255\230/9.10vue\347\254\254\344\272\214\345\244\251.md" @@ -0,0 +1,10 @@ +## vue第二天 + +event点谁 就是谁 就是谁点就是哪一个注册的dom节点 + +v-bind里不能出现-这个 应该命名成驼峰的样式 + +debugger会在调试时自动进入该断点,完了上线的时候需要删除掉这个 + + + diff --git "a/\344\277\235\345\255\230/9.12\350\256\241\347\256\227\345\261\236\346\200\247\357\274\232.md" "b/\344\277\235\345\255\230/9.12\350\256\241\347\256\227\345\261\236\346\200\247\357\274\232.md" new file mode 100644 index 0000000..cfe1960 --- /dev/null +++ "b/\344\277\235\345\255\230/9.12\350\256\241\347\256\227\345\261\236\346\200\247\357\274\232.md" @@ -0,0 +1,11 @@ +计算属性: + +优点:如果data中的数据一直没有变化 会比较data前后的值,如果前后不一致 则不会引起数据的变化 则直接从缓存中查找 + +methods每次都会执行 + +而conputed会比较 + +asion:里面不能写异步操作,只有同步操作才能执行 函数内有return就相当于是同步函数 + + \ No newline at end of file diff --git "a/\344\277\235\345\255\230/9.27wenpack.md" "b/\344\277\235\345\255\230/9.27wenpack.md" new file mode 100644 index 0000000..2c6359f --- /dev/null +++ "b/\344\277\235\345\255\230/9.27wenpack.md" @@ -0,0 +1,68 @@ +wenpack: + +打包器 把里面的less和对es6.7.vue等进行降级处理 + +模块化开发 对图片等处理为字符串 + +可以供所有的浏览器使用 + +打包之后可以节省http资源 + +---------适用范围 + +1.spa单页面程序应用 还有手机移动端 spa项目页面资源小于500个 + +2.适用于框架项目得使用 + +----------yarn安装 和npm是一样的 + +3.默认去找index.js去打包 + +-------------------------配置打包模式 + +新建一个webpack.config.js + +在这里面引入问价需要用require引用 不能用es6得inport form方式来引用 + +------------------配置入口和出口文件 + +1.入口文件文件得路径名必须写绝对路径 + +可以引入path模块 entry :path.resolve('路径名') + +也可以用 entry:path.join(__dirname,"路径名") + +2.出口文件名 + +out:{ + +filename:'文件名' + +path:ph.resolve('路径名') + +} + +-------------------webpack配置实时打包参数 + +不会生成物理文件 只会在电脑得内存中生成 + +devServer :{ + +host:'127.0.0.1'//服务器主机地址 + +port:8080//服务器端口号码(范围为1-65535之间) + +open:true//自动开启服务器 + +compress:true//开启优化压缩机制 是的网络请求更快速 + +} + +---------------------使用webpack-cleanup-luguin + +清除dist文件里 没有用的文件 用于删除文件 + +引入 然后再重新打包的时候 就会自动删除没有用的文件 + +----------------------应用引入打包css文件 + diff --git "a/\344\277\235\345\255\230/9.3\346\216\245\345\217\243\346\226\207\344\273\266.md" "b/\344\277\235\345\255\230/9.3\346\216\245\345\217\243\346\226\207\344\273\266.md" new file mode 100644 index 0000000..7938d94 --- /dev/null +++ "b/\344\277\235\345\255\230/9.3\346\216\245\345\217\243\346\226\207\344\273\266.md" @@ -0,0 +1,5 @@ +接口文件 + +写的时候要把接口文件写在处理文件之前,否则会把接口当作文件处理那么就会 报错 文件不存在404 + +​ \ No newline at end of file diff --git "a/\344\277\235\345\255\230/9.4\346\265\217\350\247\210\345\231\250\346\217\220\344\272\244\347\232\204\346\225\260\346\215\256\347\261\273\345\236\213.md" "b/\344\277\235\345\255\230/9.4\346\265\217\350\247\210\345\231\250\346\217\220\344\272\244\347\232\204\346\225\260\346\215\256\347\261\273\345\236\213.md" new file mode 100644 index 0000000..9466ce5 --- /dev/null +++ "b/\344\277\235\345\255\230/9.4\346\265\217\350\247\210\345\231\250\346\217\220\344\272\244\347\232\204\346\225\260\346\215\256\347\261\273\345\236\213.md" @@ -0,0 +1,23 @@ +node交互 + +浏览器提交的不同类型的数据,服务器有不同的接收方式,所以服务器需要知道浏览器提交的数据是什么格式 + +## 浏览器提交的数据类型 + +1.查询字符串 + +- 需要设置请求头 + + 2.formdata(默认设置请求头) + + 是一个formdata格式 + +## 服务器接收浏览器的数据 + +1.接收查询字符串的数据 + +用data和end来接受块级数据提交 + +也可以用body-parser来接受 + +2.fordata来接收. \ No newline at end of file diff --git "a/\344\277\235\345\255\230/9.6\344\270\211\346\226\271\346\250\241\345\235\227.md" "b/\344\277\235\345\255\230/9.6\344\270\211\346\226\271\346\250\241\345\235\227.md" new file mode 100644 index 0000000..9e7863e --- /dev/null +++ "b/\344\277\235\345\255\230/9.6\344\270\211\346\226\271\346\250\241\345\235\227.md" @@ -0,0 +1,20 @@ +## 三方模块 + +Accpet接收 在setHeader中设置 一般不需要设置 + +导入mysql + +js实现模块化 + +倒出 module.exports =function ac(){} + +const a =require(./a); + +a是另外一个js文件 2 + +中间件的缺点: + +- 里面会提供许多的方法但是我们不一定使用所以会造成许多代码不会执行 这样会影响加载的速度 + +![1567757095732](C:\Users\HP\AppData\Roaming\Typora\typora-user-images\1567757095732.png) + diff --git "a/\344\277\235\345\255\230/9.7cookie.md" "b/\344\277\235\345\255\230/9.7cookie.md" new file mode 100644 index 0000000..b5287d9 --- /dev/null +++ "b/\344\277\235\345\255\230/9.7cookie.md" @@ -0,0 +1,28 @@ +cookie 路由 + +cookie 应用做出相应的时候 通过head头(其实就是设置响应头) + +通过res.set({ + +"set-cookie":'name=zs'单个cookie + +“set-cookie”:['name=zs','age=30'] + +})将cookie带到浏览器中存储 然后通过其他请求的时候 可以通过req.headers把cookie拿出来 可以验证码 + +路由文件 +就是把 接口问件 根据功能分开放到不同的js文件内 +使用路由文件的步骤 +1.加载express +const express=require('express') +2.创建路由对象 +3.将所有接口挂载到路由对象上 +4.导出路由对象 +5.app.js中,导入路由模块,并注册成中间件 + + +node 依赖 +执行npm i 可以把package里面的模块全部下载出来 +require加载机制 +优先加载缓存中的模块 +如果缓存中没有模块,优先加载核心模块,并缓存 \ No newline at end of file diff --git "a/\344\277\235\345\255\230/WebAPI----BOM.xmind" "b/\344\277\235\345\255\230/WebAPI----BOM.xmind" new file mode 100644 index 0000000..3704f28 Binary files /dev/null and "b/\344\277\235\345\255\230/WebAPI----BOM.xmind" differ diff --git "a/\344\277\235\345\255\230/WebAPI---DOM.xmind" "b/\344\277\235\345\255\230/WebAPI---DOM.xmind" new file mode 100644 index 0000000..9594b1f Binary files /dev/null and "b/\344\277\235\345\255\230/WebAPI---DOM.xmind" differ diff --git "a/\344\277\235\345\255\230/es6\345\257\274\345\205\245\345\257\274\345\207\272.md" "b/\344\277\235\345\255\230/es6\345\257\274\345\205\245\345\257\274\345\207\272.md" new file mode 100644 index 0000000..9ddc710 --- /dev/null +++ "b/\344\277\235\345\255\230/es6\345\257\274\345\205\245\345\257\274\345\207\272.md" @@ -0,0 +1,3 @@ +es6导入导出 + +如果是是通过es6导出的 那么就需要import来导出 但是如果想用require的方式引用 那么则需要加一个.default来导入才可以 \ No newline at end of file diff --git "a/\344\277\235\345\255\230/\346\225\260\347\273\204\357\274\210Array\357\274\211.xmind" "b/\344\277\235\345\255\230/\346\225\260\347\273\204\357\274\210Array\357\274\211.xmind" new file mode 100644 index 0000000..272ea8e Binary files /dev/null and "b/\344\277\235\345\255\230/\346\225\260\347\273\204\357\274\210Array\357\274\211.xmind" differ