├── day22-ES6+ ├── 01.js ├── 正则表达式 │ ├── 02.test方法.html │ ├── 04.其他正则.html │ ├── 03.其他字符串方法.html │ └── 01.创建正则.html ├── 07.reject和resolve.html ├── 08.async函数.html ├── 03.try catch语句.html ├── 11.import.html ├── 01.复习.html ├── 09.await.html └── 复习.md ├── day17-BootStrap └── 03.栅格源码 │ └── mixins │ ├── grid-framework.css │ └── clearfix.less ├── day12-Less ├── less练习 │ ├── 01.基础使用 │ │ ├── 01.css │ │ ├── 01.less │ │ └── index.html │ ├── 10.其他 │ │ ├── 02.css │ │ ├── 02.less │ │ ├── 01.css │ │ ├── index.html │ │ └── 01.less │ ├── 08.重载 │ │ ├── 01.css │ │ └── 01.less │ ├── 07.模式匹配 │ │ ├── 01.css │ │ └── 01.less │ ├── 02.less的注释 │ │ ├── 01.css │ │ ├── 01.less │ │ └── index.html │ ├── 05.less计算 │ │ ├── 01.css │ │ └── 01.less │ ├── 09.守卫 │ │ ├── 01.css │ │ └── 01.less │ ├── 03.less变量 │ │ ├── 01.css │ │ └── 01.less │ ├── 04.less嵌套 │ │ ├── 01.css │ │ └── 01.less │ └── 06.less混合 │ │ ├── 01.css │ │ └── 01.less ├── 03.数组的值作为参数传递.html ├── 01.复习 │ ├── 03.深拷贝.html │ ├── 02.快排.html │ └── 01.节流.html └── 04.手写bind.html ├── day16-BootStrap └── 01.响应式布局 │ ├── 01.css2的媒体查询 │ ├── 02.css │ ├── 01.css │ └── index.html │ ├── less书写媒体查询.less │ └── less书写媒体查询.css ├── day02-DOM ├── images │ └── 02.png ├── 08.图片的load事件.html ├── 10.resize事件.html ├── 03.模拟数据双向绑定.html ├── 02.表单改变事件.html ├── 晨测.md ├── 04.鼠标事件.html ├── 05.鼠标事件2.html ├── 01.检测剩余字数.html └── 06.滚动条事件.html ├── day03-BOM ├── images │ └── 02.png ├── 14.history │ ├── 02.html │ ├── 03.html │ └── 01.html ├── 18.获取窗口的宽高.html ├── 10.计时器的this指向.html ├── 11.计时器的面试题.html ├── 08.倒计时练习.html ├── 07.间歇调用计时器.html ├── 17.scrollWidth.html ├── 06.取消超时计时器.html ├── 01.window对象.html ├── 02.系统弹窗.html ├── 09.js动画.html └── 03.打开关闭窗口.html ├── day04-DOM ├── images │ └── 01.png ├── 01.布局技巧.html ├── 10.获取文档的宽高.html ├── 16.节点操作 │ ├── 01.创建节点.html │ ├── 04.复制节点.html │ ├── 05.删除节点.html │ ├── 07.静哥鱼塘管理系统.html │ ├── 02.创建文本节点.html │ ├── 06.替换元素.html │ └── 03.插入节点.html ├── 07.scrollLeft.html ├── 03.flex-basis.html ├── 15.getBoundingClientRect.html ├── 02.布局技巧.html └── 12.回到顶部.html ├── day06-DOM ├── images │ └── 01.png ├── 02.绑定事件-静态绑定.html ├── 01.W3C事件流.html ├── 14.阻止复制.html ├── 13.键盘事件的event事件对象.html ├── 06.事件绑定的兼容.html ├── 08.event事件对象.html ├── 05.IE低版本事件处理函数.html ├── 10.阻止默认事件.html ├── 09.event的鼠标定位.html ├── 12.阻止传播.html └── 11.阻止传播.html ├── day07-DOM ├── 07.懒加载 │ └── loading.gif ├── 02.图片轮播无缝 │ └── images │ │ ├── 01.png │ │ ├── 02.png │ │ ├── 03.png │ │ ├── 04.png │ │ └── 05.png ├── 01.自定义滚动条 │ └── 01.系统滚动条.html ├── 06.正方体 │ └── 01.3d.html ├── 05.键盘控制移动 │ └── 01.键盘控制移动.html └── 晨测.md ├── day05-DOM ├── 10.图片轮播 │ └── images │ │ ├── 01.png │ │ ├── 02.png │ │ ├── 03.png │ │ ├── 04.png │ │ └── 05.png ├── 06.h5自定义属性.html ├── 08.文档碎片节点.html ├── 02.innerHTML和innerText.html ├── 07.属性的操作练习h5写法.html ├── 05.属性的操作练习.html └── 03.outerHTML和outerText.html ├── day11-JS高级 ├── 晨测.md ├── 06.h5多线程 │ └── worker.js ├── 03.定时器的思考.html ├── 01.进程和线程.html ├── 10.浅拷贝.html ├── 12.深拷贝2.html ├── 05.单线程测试.html ├── 02.常见浏览器内核和模块.html ├── 08.手写防抖.html ├── 04.事件轮询机制.html ├── 11.深拷贝.html └── 09.快速排序.html ├── day10-JS高级 ├── 晨测.md ├── 08.封装.html ├── 09.多态.html ├── 06.公有属性和公有方法.html ├── 01.闭包引入.html ├── 03.面试题.html ├── 10.继承.html └── 02.闭包.html ├── day08-JS高级 ├── module.js ├── 07.练习1.html ├── 12.回调函数.html ├── 15.this练习.html ├── 06.内存释放.html ├── 05.区分变量类型和数据类型.html ├── 08.练习2.html ├── 03.生成10位数字字母随机数.html ├── 13.IIFE.html ├── 17.面试题.html ├── 11.函数.html ├── 02.面试题.html ├── 09.练习3.html └── 10.对象.html ├── day13-jQuery01 ├── 晨测.md ├── 02.jQuery结构.html ├── 04.代码风格.html ├── 05.jQ和js对象互换.html ├── 03.jQuery执行时机.html ├── 06.jQuery的类数组操作.html └── 07.选择器.html ├── day15-jQuery03 ├── 03.$使用权和别名.html ├── jQuery.nav.js ├── 01.jquery事件简写.html ├── todolist │ └── css │ │ ├── public.css │ │ ├── public.less │ │ └── index.less ├── 04.jQuery扩展.html └── 02.on绑定事件.html ├── day01-DOM ├── 12.DOM0级绑定事件方式.html ├── 01.什么是DOM.html ├── 07.通过Name获取元素.html ├── 04.通过id获取元素.html ├── 02.document对象.html ├── 13.失去和获取焦点事件.html ├── 11.获取body html head标签.html ├── 14.模拟placeholder.html ├── 17.点击循环变色方法2.html ├── 15.点击事件.html ├── 18.键盘事件.html ├── 16.点击循环变色.html └── 08.seletors API.html ├── day18-ES5+ ├── book.json ├── 11.函数声明的作用域.html ├── 09.let特点.html ├── 06.存取器属性getter和setter.html ├── 02.JSON互换.html ├── 01.严格模式.html ├── book.xml ├── 07.函数作用域和块级作用域.html └── 10.const.html ├── day21-ES6+ ├── 01.label语句.html ├── 09.promise基础.html ├── 07.forof和forin.html ├── 06.Object的遍历器.html ├── 13.面试题.html └── 02.class.html ├── day09-JS高级 ├── 11.面试题.html ├── 02.隐式原型和显式原型.html ├── 04.instanceof.html ├── 03.基础原型链.html ├── 05.面试题.html ├── 06.手写instanceof.html ├── 08.变量对象.html └── 09.变量对象练习.html ├── day20-ES6+ ├── 01.冒泡排序.html ├── 06.函数参数默认值和rest参数.html ├── 03.对象的简写.html ├── 04.属性名表达式.html ├── 10.箭头函数的注意事项.html ├── 11.set数据解构.html ├── 08.BigInt类型.html ├── 12.map结构.html └── 晨测.md ├── day14-jQuery02 ├── 07.DOM.html ├── 03.自定义动画2.html ├── 02.自定义动画.html ├── 05.停止动画.html └── 08.DOM2.html └── day19.ES6+ ├── 09.Array的静态方法.html ├── 06.Number静态方法.html ├── 07.扩展运算符.html ├── 03.字符串的新方法.html ├── 04.Math的扩展.html └── 02.模板字符串.html /day22-ES6+/01.js: -------------------------------------------------------------------------------- 1 | console.log("hello liujie"); -------------------------------------------------------------------------------- /day17-BootStrap/03.栅格源码/mixins/grid-framework.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /day12-Less/less练习/01.基础使用/01.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: red; 3 | } 4 | -------------------------------------------------------------------------------- /day12-Less/less练习/01.基础使用/01.less: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: red; 3 | } -------------------------------------------------------------------------------- /day12-Less/less练习/10.其他/02.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | } 5 | -------------------------------------------------------------------------------- /day12-Less/less练习/10.其他/02.less: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | } -------------------------------------------------------------------------------- /day12-Less/less练习/08.重载/01.css: -------------------------------------------------------------------------------- 1 | .outer { 2 | width: 100px; 3 | height: 100px; 4 | } 5 | -------------------------------------------------------------------------------- /day16-BootStrap/01.响应式布局/01.css2的媒体查询/02.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: green; 3 | } -------------------------------------------------------------------------------- /day16-BootStrap/01.响应式布局/01.css2的媒体查询/01.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: red; 3 | } 4 | 5 | -------------------------------------------------------------------------------- /day02-DOM/images/02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day02-DOM/images/02.png -------------------------------------------------------------------------------- /day03-BOM/images/02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day03-BOM/images/02.png -------------------------------------------------------------------------------- /day04-DOM/images/01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day04-DOM/images/01.png -------------------------------------------------------------------------------- /day06-DOM/images/01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day06-DOM/images/01.png -------------------------------------------------------------------------------- /day07-DOM/07.懒加载/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day07-DOM/07.懒加载/loading.gif -------------------------------------------------------------------------------- /day05-DOM/10.图片轮播/images/01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day05-DOM/10.图片轮播/images/01.png -------------------------------------------------------------------------------- /day05-DOM/10.图片轮播/images/02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day05-DOM/10.图片轮播/images/02.png -------------------------------------------------------------------------------- /day05-DOM/10.图片轮播/images/03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day05-DOM/10.图片轮播/images/03.png -------------------------------------------------------------------------------- /day05-DOM/10.图片轮播/images/04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day05-DOM/10.图片轮播/images/04.png -------------------------------------------------------------------------------- /day05-DOM/10.图片轮播/images/05.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day05-DOM/10.图片轮播/images/05.png -------------------------------------------------------------------------------- /day07-DOM/02.图片轮播无缝/images/01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day07-DOM/02.图片轮播无缝/images/01.png -------------------------------------------------------------------------------- /day07-DOM/02.图片轮播无缝/images/02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day07-DOM/02.图片轮播无缝/images/02.png -------------------------------------------------------------------------------- /day07-DOM/02.图片轮播无缝/images/03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day07-DOM/02.图片轮播无缝/images/03.png -------------------------------------------------------------------------------- /day07-DOM/02.图片轮播无缝/images/04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day07-DOM/02.图片轮播无缝/images/04.png -------------------------------------------------------------------------------- /day07-DOM/02.图片轮播无缝/images/05.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nowLetsgo/perfect1026/HEAD/day07-DOM/02.图片轮播无缝/images/05.png -------------------------------------------------------------------------------- /day12-Less/less练习/07.模式匹配/01.css: -------------------------------------------------------------------------------- 1 | .outer { 2 | width: 100px; 3 | height: 100px; 4 | background-color: pink; 5 | } 6 | -------------------------------------------------------------------------------- /day12-Less/less练习/02.less的注释/01.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | } 5 | #box { 6 | /* width: 100px; */ 7 | height: 100px; 8 | background-color: green; 9 | } 10 | -------------------------------------------------------------------------------- /day11-JS高级/晨测.md: -------------------------------------------------------------------------------- 1 | ### 12.21晨测 2 | - 谈一谈事件轮询 3 | 4 | - 谈一谈进程和线程 5 | 6 | - 手写节流(基本注释) 7 | 8 | - 手写防抖(基本注释) 9 | 10 | - 手写快排(基本注释) 11 | 12 | 13 | - 作业提交地址 14 | https://wss.pet/s/49yrxvkjbe6 15 | -------------------------------------------------------------------------------- /day12-Less/less练习/02.less的注释/01.less: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | } 5 | 6 | //这是最外层 7 | #box { 8 | /* width: 100px; */ 9 | height: 100px; 10 | background-color: green; 11 | } -------------------------------------------------------------------------------- /day10-JS高级/晨测.md: -------------------------------------------------------------------------------- 1 | ### 12.19晨测 2 | 3 | - 谈一谈 公有 私有 静态 特权 等名词 4 | 5 | - 谈一谈闭包 6 | 7 | - 手写new (配汉语注释) 8 | 9 | - 解释封装、继承、多态 10 | 11 | - 书写一个组合继承(配汉语注释) 12 | 13 | - 作业提交地址 14 | https://wss.pet/s/49e3ax99l66 15 | 16 | -------------------------------------------------------------------------------- /day12-Less/less练习/08.重载/01.less: -------------------------------------------------------------------------------- 1 | .main(@w) { 2 | width: @w; 3 | } 4 | 5 | .main(@w, @h) { 6 | width: @w; 7 | height: @h; 8 | } 9 | 10 | .outer { 11 | //重载:根据参数个数不同,来匹配不同的混合 12 | .main(100px, 100px) 13 | } -------------------------------------------------------------------------------- /day08-JS高级/module.js: -------------------------------------------------------------------------------- 1 | ; 2 | (function (w) { 3 | var a = 1; 4 | 5 | function move() { 6 | a++; 7 | } 8 | 9 | function autoMove() { 10 | 11 | } 12 | 13 | move() 14 | automove(); 15 | })(window); -------------------------------------------------------------------------------- /day12-Less/less练习/05.less计算/01.css: -------------------------------------------------------------------------------- 1 | .outer { 2 | width: 500px; 3 | height: 400em; 4 | border: 3.33333333px solid #000; 5 | } 6 | .outer .con { 7 | width: 60%; 8 | height: calc(100% -30px); 9 | font-size: 100px; 10 | color: #f5f5f5; 11 | } 12 | -------------------------------------------------------------------------------- /day12-Less/less练习/09.守卫/01.css: -------------------------------------------------------------------------------- 1 | /* .main(@a) when(@a>30) { 2 | width: 100px; 3 | height: 100px; 4 | } 5 | 6 | .main(@a) when(@a<=30) { 7 | width: 200px; 8 | height: 200px; 9 | } */ 10 | .outer { 11 | width: 300px; 12 | height: 50px; 13 | } 14 | -------------------------------------------------------------------------------- /day13-jQuery01/晨测.md: -------------------------------------------------------------------------------- 1 | ### 12.26 晨测 2 | 3 | - js对象和jq对象互换 4 | 5 | - 分析jq结构 6 | 7 | - 写出常用的类数组操作 及 对应含义 8 | 9 | - 写出 window.onload\DOMContentLoaded\ready的区别 10 | 11 | 12 | - 写出两种数组去重的方法 13 | 14 | 15 | 16 | 17 | 作业提交地址: 18 | https://wss.pet/s/4be62duwk8e -------------------------------------------------------------------------------- /day16-BootStrap/01.响应式布局/less书写媒体查询.less: -------------------------------------------------------------------------------- 1 | body { 2 | height: 3000px; 3 | 4 | @media screen and(min-width:700px) { 5 | background-color: pink; 6 | } 7 | 8 | @media screen and(max-width:700px) { 9 | background-color: red; 10 | } 11 | } -------------------------------------------------------------------------------- /day16-BootStrap/01.响应式布局/less书写媒体查询.css: -------------------------------------------------------------------------------- 1 | body { 2 | height: 3000px; 3 | } 4 | @media screen and (min-width: 700px) { 5 | body { 6 | background-color: pink; 7 | } 8 | } 9 | @media screen and (max-width: 700px) { 10 | body { 11 | background-color: red; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /day12-Less/less练习/07.模式匹配/01.less: -------------------------------------------------------------------------------- 1 | //模式匹配中,公有的样式混合 需要书写@_做为参数 2 | .main(@_) { 3 | width: 100px; 4 | height: 100px; 5 | } 6 | 7 | .main(color1) { 8 | background-color: pink; 9 | } 10 | 11 | .main(color2) { 12 | background-color: yellow; 13 | } 14 | 15 | .outer { 16 | .main(color1) 17 | } -------------------------------------------------------------------------------- /day12-Less/less练习/10.其他/01.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | } 5 | .outer { 6 | height: 30px; 7 | width: 334px; 8 | font-size: 40%; 9 | background: url("http://doc.lipeihua.vip:8800/01.png"); 10 | } 11 | .con { 12 | background: url("http://doc.lipeihua.vip:8800/02.png"); 13 | } 14 | -------------------------------------------------------------------------------- /day12-Less/less练习/02.less的注释/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | -------------------------------------------------------------------------------- /day03-BOM/14.history/02.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |

02页面

12 | 01 13 | 03 14 | 15 | 16 | -------------------------------------------------------------------------------- /day03-BOM/14.history/03.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |

03页面

12 | 01 13 | 02 14 | 15 | 16 | -------------------------------------------------------------------------------- /day12-Less/less练习/03.less变量/01.css: -------------------------------------------------------------------------------- 1 | #outer { 2 | width: 300px; 3 | height: 300px; 4 | background: yellow; 5 | margin: auto; 6 | position: absolute; 7 | left: 0; 8 | top: 0; 9 | bottom: 0; 10 | right: 0; 11 | background: url("https: //ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1387419502,952543109&fm=26&gp=0.jpg") 0 0 no-repeat; 12 | } 13 | .class { 14 | one: 1; 15 | } 16 | .class .brass { 17 | three: 3; 18 | } 19 | -------------------------------------------------------------------------------- /day12-Less/less练习/10.其他/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | -------------------------------------------------------------------------------- /day06-DOM/02.绑定事件-静态绑定.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
box
12 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /day12-Less/less练习/05.less计算/01.less: -------------------------------------------------------------------------------- 1 | .outer { 2 | //如果只有一个单位 则以当前单位为准 3 | //如果都有单位 则以第一个单位为准 4 | width: 300px + 200; 5 | height: 20em * 20px; 6 | border: 10/3px solid #000; 7 | 8 | .con { 9 | //less中无法知道百分比的最终数值,所以只能按照百分比计算 10 | width: 100%-40px; 11 | //calc是css中渲染的方法 不会被less解析 在页面渲染的时候会计算百分比的数值然后计算 12 | height: calc(100% -30px); 13 | 14 | font-size: 1000 / 10px; 15 | 16 | color: #fff - 10; 17 | } 18 | } -------------------------------------------------------------------------------- /day11-JS高级/06.h5多线程/worker.js: -------------------------------------------------------------------------------- 1 | console.log(this); 2 | //自身接受,不需要使用任何对象绑定事件 3 | onmessage = function (mes) { 4 | //参数就是MessageEvent 保存的是postMessage发送的内容对象 5 | //参数对象的data属性就是发生的内容 6 | console.log(mes); 7 | console.log(mes.data); 8 | 9 | //开启分线程计算 10 | var num = 0; 11 | for (var i = 0; i < mes.data; i++) { 12 | num += Math.sqrt(i); 13 | } 14 | 15 | //计算完成num之后 要发送给主线程 16 | postMessage(num) 17 | 18 | 19 | // 在分线程上关闭线程: 20 | close() 21 | } -------------------------------------------------------------------------------- /day15-jQuery03/03.$使用权和别名.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /day12-Less/less练习/09.守卫/01.less: -------------------------------------------------------------------------------- 1 | /* .main(@a) when(@a>30) { 2 | width: 100px; 3 | height: 100px; 4 | } 5 | 6 | .main(@a) when(@a<=30) { 7 | width: 200px; 8 | height: 200px; 9 | } */ 10 | 11 | .main(@w) when(@w>1000), 12 | (@w<200) { 13 | width:~"@{w}px"; 14 | height: 100px; 15 | } 16 | 17 | .main(@w) when(@w<=1000) and (@w>=200) { 18 | width:~"@{w}px"; 19 | height: 50px; 20 | } 21 | 22 | 23 | 24 | .outer { 25 | //重载:根据参数个数不同,来匹配不同的混合 26 | .main(300) 27 | } -------------------------------------------------------------------------------- /day12-Less/less练习/10.其他/01.less: -------------------------------------------------------------------------------- 1 | //less中引入其他less使用@import 但是千万不要引用css 2 | @import "02.less"; 3 | 4 | @h: 30; 5 | 6 | @baseUrl: "http://doc.lipeihua.vip:8800/"; 7 | 8 | .outer { 9 | //变量加单位,字符串拼接 再转义 10 | //@{h}在字符串中书写变量 11 | //~转义 把字符串转成css可用代码 12 | height:~"@{h}px"; 13 | 14 | //less函数 可以直接使用 在官网查看函数内容 15 | width: ceil(1000/3px); 16 | font-size: percentage(4/10); 17 | //字符串插值 18 | background: url("@{baseUrl}01.png") 19 | } 20 | 21 | .con { 22 | background: url("@{baseUrl}02.png") 23 | } -------------------------------------------------------------------------------- /day01-DOM/12.DOM0级绑定事件方式.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /day01-DOM/01.什么是DOM.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /day18-ES5+/book.json: -------------------------------------------------------------------------------- 1 | { 2 | "book":[ 3 | { 4 | "name":"计算机组成原理", 5 | "time":2008, 6 | "author":"mrLi", 7 | "read":["1","2","3","4"] 8 | }, 9 | { 10 | "name":"计算机组成原理", 11 | "time":2008, 12 | "author":"mrLi", 13 | "read":["1","2","3","4"] 14 | }, 15 | { 16 | "name":"计算机组成原理", 17 | "time":2008, 18 | "author":"mrLi", 19 | "read":["1","2","3","4"] 20 | } 21 | ] 22 | } -------------------------------------------------------------------------------- /day15-jQuery03/jQuery.nav.js: -------------------------------------------------------------------------------- 1 | /* 2 | author:1026杰哥哥 3 | ul>li>h2+.con 4 | 5 | */ 6 | ; 7 | (function ($) { 8 | $.fn.extend({ 9 | nav: function () { 10 | $(this).children("li").mouseenter(function () { 11 | $(this).children(".con").stop(true, false).slideDown(500) 12 | }).mouseleave(function () { 13 | $(this).children(".con").stop(true, false).slideUp(500) 14 | }) 15 | //返回一个jq对象 方便用户链式调用 16 | return $(this); 17 | } 18 | }) 19 | })(jQuery); -------------------------------------------------------------------------------- /day22-ES6+/正则表达式/02.test方法.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /day11-JS高级/03.定时器的思考.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /day18-ES5+/11.函数声明的作用域.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /day10-JS高级/08.封装.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /day02-DOM/08.图片的load事件.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /day08-JS高级/07.练习1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /day12-Less/03.数组的值作为参数传递.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /day22-ES6+/07.reject和resolve.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /day22-ES6+/08.async函数.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /day22-ES6+/03.try catch语句.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /day18-ES5+/09.let特点.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /day21-ES6+/01.label语句.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /day06-DOM/01.W3C事件流.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /day21-ES6+/09.promise基础.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /day09-JS高级/11.面试题.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /day02-DOM/10.resize事件.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 13 | 14 | 15 | 16 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /day08-JS高级/12.回调函数.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /day16-BootStrap/01.响应式布局/01.css2的媒体查询/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /day15-jQuery03/01.jquery事件简写.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
box
12 | 13 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /day22-ES6+/11.import.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /day22-ES6+/正则表达式/04.其他正则.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /day08-JS高级/15.this练习.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /day20-ES6+/01.冒泡排序.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /day11-JS高级/01.进程和线程.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /day12-Less/less练习/04.less嵌套/01.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | background-color: pink; 4 | } 5 | .outer { 6 | width: 1200px; 7 | border: 1px solid #000; 8 | } 9 | .header { 10 | height: 100px; 11 | background-color: yellow; 12 | } 13 | .header:hover { 14 | color: yellow; 15 | } 16 | .header:hover { 17 | color: #ccc; 18 | } 19 | .con { 20 | margin: 0 auto; 21 | border: 1px solid #000; 22 | } 23 | .con > .nav { 24 | margin: 10px; 25 | } 26 | .con ~ div { 27 | color: yellow; 28 | } 29 | .footer { 30 | width: 1200px; 31 | box-shadow: 0px 0px 0px 0px #ccc; 32 | } 33 | ul li { 34 | line-height: 40px; 35 | } 36 | ul li:nth-child(1) { 37 | color: green; 38 | } 39 | ul li:nth-child(2) { 40 | color: pink; 41 | } 42 | -------------------------------------------------------------------------------- /day17-BootStrap/03.栅格源码/mixins/clearfix.less: -------------------------------------------------------------------------------- 1 | // Clearfix 2 | // 3 | // For modern browsers 4 | // 1. The space content is one way to avoid an Opera bug when the 5 | // contenteditable attribute is included anywhere else in the document. 6 | // Otherwise it causes space to appear at the top and bottom of elements 7 | // that are clearfixed. 8 | // 2. The use of `table` rather than `block` is only necessary if using 9 | // `:before` to contain the top-margins of child elements. 10 | // 11 | // Source: http://nicolasgallagher.com/micro-clearfix-hack/ 12 | 13 | .clearfix() { 14 | &:before, 15 | &:after { 16 | display: table; // 2 17 | content: " "; // 1 18 | } 19 | &:after { 20 | clear: both; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /day13-jQuery01/02.jQuery结构.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /day08-JS高级/06.内存释放.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /day08-JS高级/05.区分变量类型和数据类型.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /day01-DOM/07.通过Name获取元素.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 17 |
18 | 19 |
20 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /day03-BOM/18.获取窗口的宽高.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /day02-DOM/03.模拟数据双向绑定.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 |

13 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /day01-DOM/04.通过id获取元素.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 14 |
15 | 16 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /day06-DOM/14.阻止复制.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |

今天天气19-20度 阴

12 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /day01-DOM/02.document对象.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /day08-JS高级/08.练习2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /day18-ES5+/06.存取器属性getter和setter.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /day04-DOM/01.布局技巧.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 27 | 28 | 29 | 30 |
31 |
con
32 |
33 | 34 | 35 | -------------------------------------------------------------------------------- /day03-BOM/10.计时器的this指向.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /day09-JS高级/02.隐式原型和显式原型.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /day01-DOM/13.失去和获取焦点事件.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /day03-BOM/11.计时器的面试题.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /day11-JS高级/10.浅拷贝.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /day12-Less/less练习/01.基础使用/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 21 | 22 | 23 | 24 |
25 |
26 |
27 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /day06-DOM/13.键盘事件的event事件对象.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
box
12 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /day21-ES6+/07.forof和forin.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /day04-DOM/10.获取文档的宽高.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 14 | 15 | 16 | 17 |
18 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /day09-JS高级/04.instanceof.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /day15-jQuery03/todolist/css/public.css: -------------------------------------------------------------------------------- 1 | /*base*/ 2 | * { 3 | margin: 0; 4 | padding: 0; 5 | list-style: none; 6 | } 7 | body { 8 | background: #fff; 9 | } 10 | .btn { 11 | display: inline-block; 12 | padding: 4px 12px; 13 | margin-bottom: 0; 14 | font-size: 14px; 15 | line-height: 20px; 16 | text-align: center; 17 | vertical-align: middle; 18 | cursor: pointer; 19 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); 20 | border-radius: 4px; 21 | } 22 | .btn-danger { 23 | color: #fff; 24 | background-color: #da4f49; 25 | border: 1px solid #bd362f; 26 | } 27 | .btn-danger:hover { 28 | color: #fff; 29 | background-color: #bd362f; 30 | } 31 | .btn:focus { 32 | outline: none; 33 | } 34 | input:focus { 35 | box-shadow: 0px 0px 8px rgba(88, 170, 235, 0.8), inset 1px 3px 3px rgba(0, 0, 0, 0.03); 36 | } 37 | -------------------------------------------------------------------------------- /day02-DOM/02.表单改变事件.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /day11-JS高级/12.深拷贝2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /day13-jQuery01/04.代码风格.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
123
12 | 13 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /day11-JS高级/05.单线程测试.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 13 | 14 | 15 | 16 | 17 | 18 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /day21-ES6+/06.Object的遍历器.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /day03-BOM/08.倒计时练习.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |

敌军还有4秒到达战场

12 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /day08-JS高级/03.生成10位数字字母随机数.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /day03-BOM/07.间歇调用计时器.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /day12-Less/less练习/04.less嵌套/01.less: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | background-color: pink; 4 | } 5 | 6 | .outer { 7 | width: 1200px; 8 | border: 1px solid #000; 9 | 10 | 11 | } 12 | 13 | .header { 14 | height: 100px; 15 | background-color: yellow; 16 | 17 | &:hover { 18 | color: yellow; 19 | } 20 | } 21 | 22 | .header:hover { 23 | color: #ccc; 24 | } 25 | 26 | .con { 27 | margin: 0 auto; 28 | border: 1px solid #000; 29 | 30 | &>.nav { 31 | margin: 10px; 32 | } 33 | 34 | &~div { 35 | color: yellow; 36 | } 37 | } 38 | 39 | .footer { 40 | width: 1200px; 41 | box-shadow: 0px 0px 0px 0px #ccc; 42 | } 43 | 44 | ul { 45 | li { 46 | line-height: 40px; 47 | 48 | &:nth-child(1) { 49 | color: green; 50 | } 51 | 52 | &:nth-child(2) { 53 | color: pink; 54 | } 55 | } 56 | } -------------------------------------------------------------------------------- /day20-ES6+/06.函数参数默认值和rest参数.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /day18-ES5+/02.JSON互换.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /day12-Less/less练习/06.less混合/01.css: -------------------------------------------------------------------------------- 1 | /* .center1() { 2 | margin: auto; 3 | position: absolute; 4 | left: 0; 5 | top: 0; 6 | bottom: 0; 7 | right: 0; 8 | } */ 9 | .outer { 10 | *zoom: 1; 11 | width: 300px; 12 | height: 300px; 13 | background: yellow; 14 | margin: auto; 15 | position: absolute; 16 | left: 0; 17 | top: 0; 18 | bottom: 0; 19 | right: 0; 20 | } 21 | .outer:after { 22 | content: "\200B"; 23 | height: 0px; 24 | display: block; 25 | clear: both; 26 | } 27 | .outer .inner { 28 | width: 200px; 29 | height: 200px; 30 | background: pink; 31 | margin: auto; 32 | position: absolute; 33 | left: 0; 34 | top: 0; 35 | bottom: 0; 36 | right: 0; 37 | } 38 | .outer .inner .con { 39 | width: 100px; 40 | height: 100px; 41 | background: green; 42 | margin: auto; 43 | position: absolute; 44 | left: 0; 45 | top: 0; 46 | bottom: 0; 47 | right: 0; 48 | } 49 | -------------------------------------------------------------------------------- /day13-jQuery01/05.jQ和js对象互换.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
123
12 | 13 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /day07-DOM/01.自定义滚动条/01.系统滚动条.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 28 | 29 | 30 | 31 | 38 |
39 | 40 | 41 | -------------------------------------------------------------------------------- /day14-jQuery02/07.DOM.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 北京 13 | 草围 14 | 后瑞 15 | 16 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /day12-Less/01.复习/03.深拷贝.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /day15-jQuery03/todolist/css/public.less: -------------------------------------------------------------------------------- 1 | /*base*/ 2 | *{ 3 | margin: 0; 4 | padding: 0; 5 | list-style: none; 6 | } 7 | body { 8 | background: #fff; 9 | } 10 | 11 | .btn { 12 | display: inline-block; 13 | padding: 4px 12px; 14 | margin-bottom: 0; 15 | font-size: 14px; 16 | line-height: 20px; 17 | text-align: center; 18 | vertical-align: middle; 19 | cursor: pointer; 20 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); 21 | border-radius: 4px; 22 | } 23 | 24 | .btn-danger { 25 | color: #fff; 26 | background-color: #da4f49; 27 | border: 1px solid #bd362f; 28 | } 29 | 30 | .btn-danger:hover { 31 | color: #fff; 32 | background-color: #bd362f; 33 | } 34 | 35 | .btn:focus { 36 | outline: none; 37 | } 38 | input:focus{ 39 | box-shadow: 0px 0px 8px rgba(88,170,235,.8),inset 1px 3px 3px rgba(0,0,0,0.03); 40 | } 41 | -------------------------------------------------------------------------------- /day01-DOM/11.获取body html head标签.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /day04-DOM/16.节点操作/01.创建节点.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 18 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /day18-ES5+/01.严格模式.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /day06-DOM/06.事件绑定的兼容.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 |
13 | box 14 |
15 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /day13-jQuery01/03.jQuery执行时机.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /day08-JS高级/13.IIFE.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /day22-ES6+/01.复习.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /day08-JS高级/17.面试题.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /day02-DOM/晨测.md: -------------------------------------------------------------------------------- 1 | ### 12.8 晨测 2 | - window.onload 的作用 3 | 等待页面中的DOM节点 以及 所有的资源(图片 音频 视频 程序等等)全部加载完毕以后 才触发事件 4 | 5 | - 鼠标的mouseover事件和mouseenter事件的区别 6 | mouseover和mouseenter都是移入事件 7 | mouseover会触发冒泡 8 | mouseenter不会触发冒泡 9 | 10 | - 手写Tab切换(已知 oTitles是标题元素们 oCons是内容元素们) 11 | 12 | 13 | - 分析基本数据类型和引用数据类型的区别 14 | - 数据类型中 分为5种简单的数据类型和1种复杂的数据类型,他们分别对应着基本类型值和引用类型值 15 | - 基本类型值:null undefined string number boolean 16 | - 引用类型值:object(正则、数组、对象、函数。。。。。) 17 | - 基本类型值特点: 18 | - 我们不能给基本类型值添加属性和方法 就算添加也是获取不到的 19 | - 基本类型的比较是值的比较 20 | - 基本类型的变量是存放在栈区的(栈区指内存里的栈内存),栈区包括了变量的标识符和变量的值 21 | - 基本类型的值是不可变的 22 | - 引用类型值特点: 23 | - 引用类型的值是可变的,我们可以为引用类型添加属性和方法 24 | - 引用类型的值是同时保存在栈内存和堆内存中的对象,当我们访问某一个对象的时候,要先访问到栈区的地址 然后引用到堆区的值 25 | - 引用类型的比较是引用的比较 26 | 27 | - 为什么要标签语义化 28 | - 语义化标签更具有可读性,便于团队的开发和维护 29 | - 没有css的情况下,网页也能很好的呈现出内容结构和代码结构 30 | - 关于SEO(搜索引擎优化),搜索引擎更能理解到网页中各部分之间的关系,更准确更快速搜索信息 31 | 32 | 作业提交地址:https://wss.pet/s/4692jjc99n0 -------------------------------------------------------------------------------- /day19.ES6+/09.Array的静态方法.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /day09-JS高级/03.基础原型链.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /day12-Less/04.手写bind.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /day19.ES6+/06.Number静态方法.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /day03-BOM/17.scrollWidth.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 23 | 24 | 25 | 26 |
27 |
28 |
29 |
30 |
31 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /day14-jQuery02/03.自定义动画2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 19 | 20 | 21 | 22 | 23 |
div
24 | 25 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /day10-JS高级/09.多态.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /day12-Less/01.复习/02.快排.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /day08-JS高级/11.函数.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /day11-JS高级/02.常见浏览器内核和模块.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /day03-BOM/06.取消超时计时器.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /day13-jQuery01/06.jQuery的类数组操作.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 |

p1

13 |

p2

14 |
15 |
16 | span1 17 | span2 18 |
19 | 111 20 | 21 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /day12-Less/less练习/06.less混合/01.less: -------------------------------------------------------------------------------- 1 | //定义一个混合 2 | //不带参数的混合 3 | /* .center1() { 4 | margin: auto; 5 | position: absolute; 6 | left: 0; 7 | top: 0; 8 | bottom: 0; 9 | right: 0; 10 | } */ 11 | 12 | //带参数的混合,并且可以设置参数默认值 13 | .center2(@w, @h, @bg: yellow) { 14 | width: @w; 15 | height: @h; 16 | background: @bg; 17 | margin: auto; 18 | position: absolute; 19 | left: 0; 20 | top: 0; 21 | bottom: 0; 22 | right: 0; 23 | } 24 | 25 | //清浮动混合 26 | .clearFix() { 27 | *zoom: 1; //css hack 低版本IE开启haslayout 28 | 29 | &:after { 30 | content: "\200B"; 31 | height: 0px; 32 | display: block; 33 | clear: both; 34 | } 35 | } 36 | 37 | .outer { 38 | .clearFix(); //使用混合 39 | // .center1(); 40 | .center2(300px, 300px, yellow); 41 | 42 | 43 | .inner { 44 | // .center1(); 45 | .center2(200px, 200px, pink); 46 | 47 | .con { 48 | // .center1(); 49 | .center2(@bg: green, @w: 100px, @h: 100px); 50 | } 51 | } 52 | } -------------------------------------------------------------------------------- /day19.ES6+/07.扩展运算符.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /day20-ES6+/03.对象的简写.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /day20-ES6+/04.属性名表达式.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /day14-jQuery02/02.自定义动画.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 16 | 17 | 18 | 19 | 20 |
div
21 | 22 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /day08-JS高级/02.面试题.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /day05-DOM/06.h5自定义属性.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /day08-JS高级/09.练习3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /day03-BOM/01.window对象.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /day22-ES6+/正则表达式/03.其他字符串方法.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /day06-DOM/08.event事件对象.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 | 静哥我错了 13 |
14 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /day22-ES6+/正则表达式/01.创建正则.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /day07-DOM/06.正方体/01.3d.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 36 | 37 | 38 | 39 |
40 |
41 |
42 | 43 | 44 | -------------------------------------------------------------------------------- /day08-JS高级/10.对象.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /day09-JS高级/05.面试题.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /day04-DOM/16.节点操作/04.复制节点.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 18 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /day20-ES6+/10.箭头函数的注意事项.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /day12-Less/less练习/03.less变量/01.less: -------------------------------------------------------------------------------- 1 | //变量使用@来定义,使用的时候也要添加@ 2 | //1.作为样式的值使用 3 | @z: 0; 4 | @mainColor: yellow; 5 | //2.作为属性名 使用的时候 @{变量名} 6 | @bg: background; 7 | 8 | //3.作为选择器使用 用的时候 @{变量名} 9 | @o: #outer; 10 | 11 | //4.作为url地址 12 | @img1: "https: //ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1387419502,952543109&fm=26&gp=0.jpg"; 13 | 14 | //4.作为url地址2 15 | @img2: url("https: //ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1387419502,952543109&fm=26&gp=0.jpg"); 16 | 17 | //5.变量计算 18 | @c: @z+2; 19 | 20 | @img3: url(@img1); 21 | 22 | @{o} { 23 | width: 300px; 24 | height: 300px; 25 | @{bg}: @mainColor; 26 | margin: auto; 27 | position: absolute; 28 | left: @z; 29 | top: @z; 30 | bottom: @z; 31 | right: @z; 32 | // background: url(@img1) 0 0 no-repeat; 33 | // background: @img2 0 0 no-repeat; 34 | background: @img3 0 0 no-repeat; 35 | } 36 | 37 | 38 | //练习 39 | @var: 0; 40 | 41 | .class { 42 | @var: 1; 43 | 44 | .brass { 45 | @var: 2; 46 | //less变量延迟加载,也就是等待当前样式所在区域的代码全部执行完毕,才进行加载变量 47 | three: @var; 48 | @var: 3; 49 | } 50 | 51 | one: @var; 52 | } -------------------------------------------------------------------------------- /day01-DOM/14.模拟placeholder.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /day21-ES6+/13.面试题.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /day03-BOM/14.history/01.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |

01页面

12 | 02 13 | 03 14 | 15 | 16 | 17 | 18 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /day05-DOM/08.文档碎片节点.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 13 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /day06-DOM/05.IE低版本事件处理函数.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 |
13 | box 14 |
15 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /day18-ES5+/book.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 计算机组成原理 5 | 6 | mrLi 7 | 8 | 杰哥2 9 | 杰哥1 10 | 杰哥3 11 | 杰哥4 12 | 13 | 14 | 15 | 计算机组成原理 16 | 17 | mrLi 18 | 19 | 杰哥2 20 | 杰哥1 21 | 杰哥3 22 | 杰哥4 23 | 24 | 25 | 26 | 计算机组成原理 27 | 28 | mrLi 29 | 30 | 31 | 计算机组成原理 32 | 33 | mrLi 34 | 35 | 36 | 计算机组成原理 37 | 38 | mrLi 39 | 40 | 41 | 计算机组成原理 42 | 43 | mrLi 44 | 45 | -------------------------------------------------------------------------------- /day04-DOM/07.scrollLeft.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 22 | 23 | 24 | 25 | 26 |
27 |
28 |
29 | 47 | 48 | 49 | -------------------------------------------------------------------------------- /day04-DOM/03.flex-basis.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 40 | 41 | 42 | 43 | 49 | 50 | 51 | -------------------------------------------------------------------------------- /day04-DOM/16.节点操作/05.删除节点.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 18 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /day01-DOM/17.点击循环变色方法2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 15 | 16 | 17 | 18 |
19 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /day06-DOM/10.阻止默认事件.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 15 | 16 | 17 | 18 |
19 | 20 |
21 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /day01-DOM/15.点击事件.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 15 | 16 | 17 | 18 |
19 | 47 | 48 | 49 | -------------------------------------------------------------------------------- /day12-Less/01.复习/01.节流.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /day01-DOM/18.键盘事件.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 11 | 12 | 13 | 14 | 15 |
123
16 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /day15-jQuery03/04.jQuery扩展.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 14 | 15 | 16 | 17 |
18 | 19 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /day15-jQuery03/todolist/css/index.less: -------------------------------------------------------------------------------- 1 | @import "public"; 2 | .todo-container{ 3 | width: 600px; 4 | margin: 50px auto; 5 | padding: 15px; 6 | border: 1px solid #ddd; 7 | border-radius: 5px; 8 | .todo-header{ 9 | margin-bottom: 20px; 10 | input{ 11 | width: 600px; 12 | box-sizing: border-box; 13 | height: 30px; 14 | padding: 0 10px; 15 | outline: none; 16 | border:1px solid #ddd; 17 | } 18 | input:focus{ 19 | outline: 0; 20 | } 21 | } 22 | .todo-main{ 23 | border:1px solid #ddd; 24 | border-radius: 5px; 25 | .todo-list{ 26 | height: 40px; 27 | line-height: 40px; 28 | padding: 0 5px; 29 | border-bottom: 1px solid #ddd; 30 | &:last-child{ 31 | border-bottom: none; 32 | } 33 | button{ 34 | float: right; 35 | margin-top: 3px; 36 | display: none; 37 | } 38 | } 39 | } 40 | .todo-footer{ 41 | height: 40px; 42 | line-height: 40px; 43 | button{ 44 | float: right; 45 | margin-top: 5px; 46 | } 47 | } 48 | } -------------------------------------------------------------------------------- /day09-JS高级/06.手写instanceof.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /day04-DOM/16.节点操作/07.静哥鱼塘管理系统.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 |

新增鱼儿

13 |
14 | 18 |
19 |
20 | 24 |
25 |
26 | 30 |
31 | 32 | 33 |
34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 |
静哥的鱼塘
姓名性别年龄操作
小美18 删除
49 | 50 | 51 | -------------------------------------------------------------------------------- /day10-JS高级/06.公有属性和公有方法.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 50 | 51 | 52 | -------------------------------------------------------------------------------- /day11-JS高级/08.手写防抖.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 10 | 11 | 12 | 13 | 14 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /day04-DOM/16.节点操作/02.创建文本节点.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 18 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /day04-DOM/16.节点操作/06.替换元素.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 18 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /day11-JS高级/04.事件轮询机制.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /day04-DOM/15.getBoundingClientRect.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 24 | 25 | 26 | 27 |
28 |
29 |
30 | 48 | 49 | 50 | -------------------------------------------------------------------------------- /day03-BOM/02.系统弹窗.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /day01-DOM/16.点击循环变色.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 15 | 16 | 17 | 18 |
19 | 49 | 50 | 51 | -------------------------------------------------------------------------------- /day06-DOM/09.event的鼠标定位.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 27 | 28 | 29 | 30 |
31 |
32 |
33 | 50 | 51 | 52 | -------------------------------------------------------------------------------- /day22-ES6+/09.await.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /day22-ES6+/复习.md: -------------------------------------------------------------------------------- 1 | ## 复习 2 | ### html 3 | - 常见标签 H5新标签 新属性 input新type类型 4 | - 音视频 音视频的DOM的方法 5 | - canvas 6 | - classList 7 | - web Worker 8 | - web Stroage 9 | - Web Socket 10 | - BFC 11 | - 包含块 12 | 13 | ### css 14 | - 盒子模型 15 | - 浮动 定位 16 | - flex 17 | - 响应式 18 | - 阴影 背景 渐变 倒影 滤镜 19 | - 过度动画 关键帧动画 20 | - transform 21 | 22 | 23 | ### Js 24 | - 数据类型 25 | - 语句 26 | - 操作符 27 | - 数组 28 | - 对象 29 | - 字符串 30 | - regExp 31 | - function 32 | - Date(倒计时) Math(随机数) 33 | - Set Map 34 | - 构造函数 35 | - 原型 36 | - 原型链 37 | - 闭包 38 | - 作用域链 39 | - 执行上下文 变量对象 this 40 | - 原型图 41 | - 面向对象 42 | 43 | - DOM 44 | - 增删改查 45 | - 事件 46 | - css脚本化 47 | - 图片轮播 48 | - tab切换 49 | - 拖拽 50 | - 碰壁反弹 51 | - 自定义滚动条 52 | - 侧边栏 53 | - 节点互换 54 | - BOM 55 | - window 56 | - 定时器 57 | - js重定向 loaction.href window.open 58 | - location 59 | - history 60 | - navigator 61 | 62 | ### jQ 63 | - 语法 64 | - 事件 65 | - 类数组操作 66 | - 选择器 67 | - 动画 68 | - 插件 69 | 70 | ### Boostrap 71 | - 栅格原理 72 | - swiper 73 | - UI框架的使用 74 | 75 | ### ES6 76 | - let const 77 | - 解构 78 | - 箭头函数 79 | - 对象的新方法 80 | - 数组的新方法 reduce 81 | - 新类型 和新数据解构 82 | - promise async await 83 | - iterator 84 | - generator 85 | - class 86 | 87 | ### git 88 | - 初始化 89 | - 本地仓库的操作 90 | - 三个区域 91 | - 回退操作 92 | - 撤销操作 93 | - 远程有仓库 本地没有仓库 94 | - 远程没有仓库 本地有仓库 95 | - ssh 96 | - 团队协作 97 | - git分支 98 | - 合并并解决冲突 -------------------------------------------------------------------------------- /day05-DOM/02.innerHTML和innerText.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 |
13 | 点我你懂的 14 |
15 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /day20-ES6+/11.set数据解构.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /day07-DOM/05.键盘控制移动/01.键盘控制移动.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 18 | 19 | 20 | 21 |
22 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /day02-DOM/04.鼠标事件.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 15 | 16 | 17 | 18 |
19 | 52 | 53 | 54 | -------------------------------------------------------------------------------- /day01-DOM/08.seletors API.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 17 | 47 | 48 | 49 | -------------------------------------------------------------------------------- /day04-DOM/02.布局技巧.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 55 | 56 | 57 | 58 |
59 | 60 |
61 |
62 | 63 | 64 | -------------------------------------------------------------------------------- /day04-DOM/12.回到顶部.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 24 | 25 | 26 | 27 |
28 |
29 |
30 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /day02-DOM/05.鼠标事件2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 22 | 23 | 24 | 25 |
26 |

27 |
28 | 59 | 60 | 61 | -------------------------------------------------------------------------------- /day04-DOM/16.节点操作/03.插入节点.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 18 | 50 | 51 | 52 | -------------------------------------------------------------------------------- /day10-JS高级/01.闭包引入.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 17 | 56 | 57 | 58 | -------------------------------------------------------------------------------- /day09-JS高级/08.变量对象.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /day13-jQuery01/07.选择器.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 19 | 25 | 26 |
27 | 28 | 29 | 33 | 34 |
35 |

h222

36 | 37 | 56 | 57 | 58 | -------------------------------------------------------------------------------- /day15-jQuery03/02.on绑定事件.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 |
box
14 | 20 | 21 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /day02-DOM/01.检测剩余字数.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 | 13 |

还可以输入40

14 |
15 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /day10-JS高级/03.面试题.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 58 | 59 | 60 | -------------------------------------------------------------------------------- /day18-ES5+/07.函数作用域和块级作用域.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 14 | 15 | 18 | 19 | 22 | 23 | 58 | 59 | 60 | 61 | -------------------------------------------------------------------------------- /day02-DOM/06.滚动条事件.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 27 | 28 | 29 | 30 |
31 |

32 |
33 | 59 | 60 | 61 | -------------------------------------------------------------------------------- /day05-DOM/07.属性的操作练习h5写法.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 14 | 15 | 16 | 17 | 18 | 30 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /day05-DOM/05.属性的操作练习.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 14 | 15 | 16 | 17 | 18 | 30 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /day03-BOM/09.js动画.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 19 | 20 | 21 | 22 | 23 |
24 | 50 | 51 | 52 | -------------------------------------------------------------------------------- /day14-jQuery02/05.停止动画.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 15 | 16 | 17 | 18 |
19 | 20 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /day18-ES5+/10.const.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 59 | 60 | 61 | -------------------------------------------------------------------------------- /day03-BOM/03.打开关闭窗口.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 49 | 50 | 51 | -------------------------------------------------------------------------------- /day09-JS高级/09.变量对象练习.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 70 | 71 | 72 | -------------------------------------------------------------------------------- /day05-DOM/03.outerHTML和outerText.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 |
13 | 点我你懂的 14 |
15 | 52 | 53 | 54 | -------------------------------------------------------------------------------- /day06-DOM/12.阻止传播.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 21 | 22 | 23 | 24 |
25 |
26 |
27 | 58 | 59 | 60 | -------------------------------------------------------------------------------- /day10-JS高级/10.继承.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /day11-JS高级/11.深拷贝.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 54 | 55 | 56 | -------------------------------------------------------------------------------- /day20-ES6+/08.BigInt类型.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /day10-JS高级/02.闭包.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 66 | 67 | 68 | -------------------------------------------------------------------------------- /day19.ES6+/03.字符串的新方法.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 56 | 57 | 58 | -------------------------------------------------------------------------------- /day21-ES6+/02.class.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 64 | 65 | 66 | -------------------------------------------------------------------------------- /day06-DOM/11.阻止传播.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 |
13 |
14 |
con
15 |
16 |
17 | 18 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /day20-ES6+/12.map结构.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 54 | 55 | 56 | -------------------------------------------------------------------------------- /day19.ES6+/04.Math的扩展.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 65 | 66 | 67 | -------------------------------------------------------------------------------- /day19.ES6+/02.模板字符串.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 17 | 68 | 69 | 70 | -------------------------------------------------------------------------------- /day07-DOM/晨测.md: -------------------------------------------------------------------------------- 1 | ### 12.15 晨测 2 | - 手写生成[10,80)的随机数 3 | Math.random();//[0,1) 4 | Math.random()*70;//[0,70) 5 | Math.random()*70 + 10;//[10,80) 6 | Math.floor(Math.random()*70 + 10); 7 | 8 | - 生成一个7天以后的现在的时间 9 | 比如现在是2020年12月15日16点33分20秒 则得到一个2020年12月22日16点33分20秒 10 | 方法一: 11 | new Date().setDate(new Date().getDate() + 7) 12 | 13 | 方法二: 14 | new Date(Date.now() + 1000*60*60*24*7); 15 | 16 | 17 | - 谈一谈滚轮事件 18 | 滚轮事件: 19 | 谷歌/ie: 20 | onmousewheel 21 | 上滚: 22 | e.wheelDelta > 0 23 | 下滚: 24 | e.wheelDelta < 0 25 | 26 | 火狐: 27 | DOMMouseScroll 28 | 上滚: 29 | e.detail < 0 30 | 下滚: 31 | e.detail > 0 32 | 33 | - 常见的H5标签及相应的含义 34 | - header:用来定义文档(网页或者是某一个段落)的页眉(头部) 35 | - footer:footer标签代表一个网页或者章节内容的底部区域(页脚 36 | - article:表文档、页面、或程序中,可以独立的完整的被外部引用的内容 37 | - nav:表示在当前文档或其他文档中提供导航链接。 38 | 静态导航: 39 | nav>a 40 | 动态导航: 41 | nav>ul>li>a 42 | - section:section是html中一个独立的区域(主要针对网页分块),没有其他语义,一般会包含一个独立的标题 43 | - aside:侧边栏 表示一个和其余页面内容几乎无关的区域 44 | 45 | - 表单元素的新属性 46 | - placeholder:占位符 47 | - autocomplete:是否提示用户曾经输入过的值 默认是on 关闭是off 48 | - autofocus:默认自动获取焦点,他有唯一一个值是autofocus 49 | - required:必填项,当提交的时候,此表单必须填写 50 | - disabled:禁用任何表单元素,这个元素就被禁止输入或选择等等操作 51 | - checked:单选框或多选框 默认被选中 52 | - readonly:对于可编辑的表单来说 表示不能再次被编辑 但是是可以被提交的 53 | - selected: select元素默认选中项 54 | - multiple: 让select可以进行多选(按住ctrl键进行多选) 55 | 56 | 作业: 57 | 1.侧边栏 58 | 59 | 作业提交地址 60 | 61 | -------------------------------------------------------------------------------- /day11-JS高级/09.快速排序.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 56 | 57 | 58 | -------------------------------------------------------------------------------- /day20-ES6+/晨测.md: -------------------------------------------------------------------------------- 1 | - 谈一谈箭头函数 2 | - ES6 允许使用“箭头”(=>)定义函数 3 | - 关于this 箭头函数没有自己的this,箭头函数内部的this并不是调用时候指向的对象,而是定义函数时所在函数的this指向 4 | - 箭头函数不能用于构造函数,也就是不能使用new关键字调用 5 | - 箭头函数没有arguments对象,只能使用rest参数 6 | 7 | - 谈一谈Symbol类型 8 | - ES6 引入了一种新的原始数据类型Symbol,表示独一无二的值。它是 JavaScript 语言的第七种数据类型 9 | - Symbol 值通过Symbol函数生成 直接Symbol()即可 10 | - Symbol中传入的字符串没有任何意义,只是用来描述Symbol的 11 | - Symbol不能使用New调用 12 | - 类型转换的时候,不能转数字 13 | - 如果把Symbol当作一个对象的属性和方法的时候,一定要用一个变量来储存,否则定义的属性和方法没有办法使用 14 | - for in 不能遍历出来,可以使用Object.getOwnPropertySymbols方法来拿 15 | 16 | - 谈一谈BigInt类型 17 | - JavaScript 所有数字精度只能到 53 个二进制位(2的53次方),大于这个范围的整数,JavaScript 是无法精确表示的。 18 | - 大于或等于2的1024次方的数值,JavaScript 无法表示,会返回Infinity。 19 | - ES6引入了一种新的数据类型 BigInt(大整数)。BigInt 只用来表示整数,没有位数的限制,任何位数的整数都可以精确表示。 20 | - 为了与 Number 类型区别,BigInt 类型的数据必须添加后缀n。 21 | - BigInt 与普通整数是两种值,它们之间并不全等 22 | 23 | - 谈一谈 Set 24 | - ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值 25 | - Set本身是一个构造函数,用来生成 Set 数据结构 26 | - Set函数可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为参数,用来初始化 27 | - 可以用于字符串或数组去重 28 | - 方法 29 | - size 返回Set的长度 30 | - add 添加某个值 31 | - delete 删除某个值 32 | - has 返回一个布尔值,表示该值是否为Set的成员 33 | - clear 清除所有成员 34 | - forEach 遍历 35 | 36 | - 谈一谈 Map 37 | - JavaScript 的对象(Object),传统上只能用字符串当作键。 38 | - ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键 39 | - 书写格式是new Map([[key,value],[key,value],[key,value]]) 40 | - 方法 41 | - size 长度。 42 | - set设置 43 | - get获取。 44 | - has判断 45 | - delete删除 46 | - forEach 遍历 47 | 48 | - 作业提交地址 https://wss.pet/s/4ej32tne5wu 49 | -------------------------------------------------------------------------------- /day14-jQuery02/08.DOM2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 19 | 20 | 49 | 50 | 51 | --------------------------------------------------------------------------------