- 博客(49)
- 收藏
- 关注
RSS订阅原创 WEB前端学习课程推荐
web前端学习过程中，发现一位实力老师讲得蛮好，讲课激情全是干货，学习课程链接（非免费）:https://www.it666.com/sales?fid=813&burl=/course_set/144；https://www.it666.com/sales?fid=813&burl=/course_set/19；https://www.it666.com/sales?fid...
2019-11-12 09:38:58
484
翻译 Git使用
01- Git单人使用单人流程:一、准备工作(只做一次):1.创建一个工作区2.在工作区中的打开git终端3.通过git init指令, 初始化版本库4.通过git config user.name “姓名”git config user.email “邮箱”设置用户名和邮箱(不设置要挨骂)5.通过git config -l查看设置情况二、开发阶段(反复执行)1.编写代码2...
2019-09-29 11:08:27
155
翻译 GASP动画和ScrollMagic
一、GSAP基础1.GSAP开篇1.什么是ScrollMagic?ScrollMagic是一个滚动视差插件ScrollMagic本身比较简单，只包含2个类：crollMagic.Controller 一个控制器类，用于总体的调度 ；ScrollMagic.Scene 一个场景类，用于设计具体的变换。需要注意的是，它本身并没有集成 animation的控制方法，动画的实现，需要引入插件...
2019-09-29 11:08:09
3697
翻译 Bootstrap-基础
一、Bootstrap开篇什么是Bootstrap?Bootstrap 是twitter公司推出的，专门用于开发响应式布局、移动设备优先的 WEB 框架。Bootstrap当前最新的版本的Bootstrap4, 但当下企业使用最多的是Bootstrap3Bootstrap3和4的区别2.1CSS预处理器不同, Bootstrap3采用Less, Bootstrap4采用SASS...
2019-08-24 10:55:49
421
翻译 Echarts-基础
一、Echats概念1.什么是ECharts?ECharts是一个使用 JavaScript 实现的"数据可视化"库, 它可以流畅的运行在 PC 和移动设备上；2.什么是数据可视化?也就是可以将数据通过图表的形式展示出来；3.ECharts提供的图表类型ECharts 提供了常见的折线图、柱状图、散点图、饼图、K线图， 用于统计的盒形图， 用于地理数据可视化的地图、热力图、线图， ...
2019-08-07 22:30:53
484
翻译 SVG-基础
一、SVG概念什么是SVG?SVG英文全称为Scalable Vector Graphics，意思为可缩放的矢量图位图和矢量图在计算机中有两种图形, 一种是位图, 一种是矢量图2.1位图:传统的 jpg / png / gif图都是位图位图是一个个很小的颜色小方块组合在一起的图片。一个小方块代表1px2.2位图的优点和缺点:优点: 色彩丰富逼真缺点: 放大后会失真, 体...
2019-08-07 22:30:36
694
翻译 Canvas-基础
一、Canvas概念什么是Canvas？Canvas是H5新增的一个标签, 我们可以通过JS在这个标签上绘制各种图案；Canvas 拥有多种绘制路径、矩形、圆形、字符以及图片的方法。注意点：2.1canvas标签有默认的宽度和高度，默认的宽度是300px，默认的高度是150px；2.2不能通过CSS设置画布的宽高；通过CSS设置画布宽高会在默认宽高的基础上拉伸； 如果需要设置ca...
2019-08-07 22:30:14
232
翻译 动画插件
一、什么是Animate.css? 其实swiper-animate就是参考Animate.css演变出来的一个插件, Animate.css和swiper-animate一样都是用于快速添加动画的, 所以会用swiper-animate就会用Animate.css 2.Animate.css的使用: 2.1引入animate.css的文件 2.2...
2019-08-07 22:29:44
272
翻译 IScorll和Swiper
一、IScroll基本使用什么是iScroll?iScroll是一个高性能，资源占用少，无依赖，多平台的javascript滚动插件。iScroll不仅仅是滚动。在你的项目中包含仅仅4kb大小的iScroll，能让你的项目便拥有滚动，缩放，平移，无限滚动，视差滚动，旋转功能iScroll基本使用2.1按照iScroll的规定搭建HTML结构2.2引入iScroll2.3创建i...
2019-08-07 22:29:18
231
翻译 Zepto-基础
一、1. Zepto是什么?Zepto 是一个轻量级的针对现代高级浏览器的 JavaScript库，它与jQuery有着类似的api, 如果你会用jQuery，那么你也会用Zepto既然和jQuery差不多, 为什么还需要Zepto?2.1jQuery更多是在PC端被应用，Zepto更多是在移动端被应用；也正是因为jQuery用在PC端, 所以jQuery考虑了很多低级浏览器的的...
2019-08-07 22:28:46
509
翻译 Jsonp和Promise-基础
一、JSONP什么是JSONP? （解决跨域访问问题）JSONP让网页从别的地址（跨域的地址）那获取资料，即跨域读取数据；JSONP实现跨域访问的原理2.1在同一界面中可以定义多个script标签2.2同一个界面中多个script标签中的数据可以相互访问2.3可以通过script的src属性导入其它资源2.4通过src属性导入其它资源的本质就是将资源拷贝到script标签中2.5...
2019-08-07 22:28:06
227
翻译 网络编程-基础
一、H5新增存储方案什么是SessionStorage和LocalStorage和Cookie一样, SessionStorage和LocalStorage也是用于存储网页中的数据的Cookie、 SessionStorage、LocalStorage区别2.1 生命周期(同一浏览器下)Cookie生命周期: 默认是关闭浏览器后失效, 但是也可以设置过期时间Se...
2019-08-07 22:27:35
93
翻译 Json和JS模板的使用
主要用在写同类型的样式：自己的理解: 先用 JSON存储数据，并转换成JS对象；再在HTML中的 script 标签中写好JS模板（一般是先用HTML标签写好结构并在CSS中写好对应结构的样式，然后就是替换对应区域的内容），并根据对应格式将数据写入模板中。这样写一次模板就可生成同类型但不同内容的样式了。一、JSON1.什么是JSON?JSON(JavaScript Object Not...
2019-08-07 22:26:28
630
翻译 Sass-1-基础
一、什么是SASS(Syntactically Awesome Stylesheets Sass)1.SASS是一套利用Ruby实现的, 最早最成熟的CSS预处理器, 诞生于2007年;它扩展了 CSS 语言，增加了变量、Mixin(混合)、嵌套、函数和运算等特性，使 CSS 更易维护和扩展;2.如何学习SASS?LESS是一套利用JavaScript实现的CSS预处理器, 诞生于2009年...
2019-07-18 15:39:48
302
翻译 Fullpage-1-基础
一、概念与使用1.什么是Fullpage?Fullpage.js 是一个基于jQuery的插件，他能够很方便、很轻松的制作出全屏滚动网站。2.什么是jQuery ?用JS封装的一个框架、3.为什么要学习插件或者框架？在企业开发中因为开发时间、企业成本等因素；所以并不是所有的功能都需要我们自己实现；大部分情况下一些常用的功能都有现成的插件或者框架；我们只需要找到合适的插件或者框架，快速学...
2019-07-18 15:38:14
147
翻译 LESS-1-基础
一、概念1.什么是CSS预处理器?CSS 预处理器就是用某一种语言用来为 CSS 增加一些动态语言的的特性(变量、函数、继承等)，CSS预处理器可以让你的 CSS 更见简洁，适应性更强，代码更直观等诸多好处；简而言之: CSS预处理器就是升级版CSS2.常见的CSS预处理器Less、 Sass 、Stylus1.为什么需要less?1.1CSS的语法虽然简单, 但它同时也带来一些...
2019-07-18 15:34:55
424
翻译 JS-27-函数防抖和节流
一、函数防抖1.什么是函数防抖[debounce]?函数防抖是优化高频率执行js代码的一种手段；可以让被调用的函数在一次连续的高频操作过程中只被调用一次2.函数防抖作用减少代码执行次数, 提升网页性能3.函数防抖应用场景 oninput / onmousemove / onscroll / onresize等事件 */ let oInput = document.qu...
2019-07-01 17:25:01
137
翻译 JS-26-获取元素宽高其他方式/ 获取网页宽高
一、获取元素宽高其它方式1.通过 getComputedStyle 获取宽高1.1获取的宽高不包括 边框和内边距1.2即可以获取行内设置的宽高也可以获取CSS设置的宽高1.3只支持获取, 不支持设置1.4只支持IE9及以上浏览器2.通过 currentStyle 属性获取宽高2.1获取的宽高不包括 边框和内边距2.2即可以获取行内设置的宽高也可以获取CSS设置的宽高2.3只支持获...
2019-07-01 17:24:26
347
原创 JS-25-BOM基本
1.什么是BOM?DOM就是一套操作HTML标签的API(接口/方法/属性)；BOM就是一套操作浏览器的API(接口/方法/属性)；2.BOM中常见的对象window: 代表整个浏览器窗口注意: window是BOM中的一个对象, 并且是一个顶级的对象(全局)；Navigator: 代表当前浏览器的信息, 通过Navigator我们就能判断用户当前是什么浏览器；var agent =...
2019-06-05 17:20:24
133
原创 JS-24-正则表达式
一、正则表达式运用1.什么是正则表达式?正则表达式就是对字符串操作的一种逻辑公式2.正则表达式的作用?1.在字符串"查找"是否包含指定子串2.从字符串中"提取"指定子串3.对字符串中指定的内容进行"替换"1.字符串查找 let str = "123abc456"; let index = str.indexOf("abc"); let index = str.las...
2019-06-03 11:44:09
250
原创 JS-23-DOM事件
一、DOM事件1.什么是事件?用户和浏览器之间的交互行为我们就称之为事件, 比如：点击，移入/移出;2.如何给元素绑定事件?在JavaScript中所有的HTML标签都可以添加事件;元素.事件名称 = function(){};当对应事件被触发时候就会自动执行function中的代码; let oBtn = document.querySelector("button"); oBt...
2019-06-03 11:43:48
175
原创 JS-22-闭包 / 表单补充 /循环索引同步
一、闭包1.什么是闭包(closure)?闭包是一种特殊的函数。2.如何生成一个闭包?当一个内部函数引用了外部函数的数据(变量/函数)时, 那么内部的函数就是闭包；所以只要满足"是函数嵌套"、“内部函数引用外部函数数据”；3.闭包特点:只要闭包还在使用外部函数的数据, 那么外部的数据就一直不会被释放；也就是说可以延长外部函数数据的生命周期；4.闭包注意点:当后续不需要使用闭包时...
2019-05-31 15:27:58
130
原创 JS-21-对元素 内容 / 样式 的操作
一、JavaScript-元素内容操作<div> 我是div <h1>我是标题</h1> <p>我是段落</p></div>(1).获取元素内容1.innerHTML 获取的内容包含标签, innerText / textContent 获取的内容不包含标签;2.innerHTML / te...
2019-05-15 23:50:05
153
原创 JS-20-元素 / 属性 增删改查
一、JavaScript-元素增删改查1.创建节点let oSpan = document.createElement("span");2.添加节点注意点: appendChild方法会将指定的元素添加到最后;// let oDiv = document.querySelector("div");// oDiv.appendChild(oSpan) //将oSpan中的元素添加到oDi...
2019-04-28 09:57:24
247
原创 JS-19-获取DOM元素
一、JavaScript-DOM开篇1.什么是window?window：是一个全局对象, 代表浏览器中一个打开的窗口, 每个窗口都是一个window对象；2.什么是document?document是window的一个属性, 这个属性是一个对象；document: 代表当前窗口中的整个网页；document对象保存了网页上所有的内容, 通过document对象就可以操作网页上的内容；...
2019-04-28 09:56:49
169
原创 JS-18-JS三大对象
一、JavaScript中提供三种自带的对象, 分别是"本地对象"/“内置对象”/“宿主对象”什么是宿主?宿主就是指JavaScript运行环境, js可以在浏览器中运行, 也可以在服务器上运行(node. js)；1.本地对象与宿主无关，无论在浏览器还是服务器中都有的对象，就是ECMAScript标准中定义的类(构造函数)。在使用过程中需要我们手动new创建：例如：Boolean、N...
2019-04-28 09:53:03
325
原创 JS-17-字符串常用方法 / 常量注意点
一、在js中字符串可以看做一个特殊的数组, 所以大部分数组的属性 / 方法字符串都可以使用1.获取字符串长度 .length let str = "abcd"; console.log(str.length);2.获取某个字符 [索引] / charAt let str = "abcd"; let ch = str[1]; let ch =...
2019-04-24 09:33:22
458
原创 JS-16-数组高级API
一、数组高级API上注意点: 对象中的属性是无序的for in循环是专门用于遍历对象的, 但是对象的属性是无序的, 所以forin循环就是专门用于遍历无序的东西的, 所以不推荐使用for in循环来遍历数组；1.利用ES6中推出的for of循环来遍历数组: for(let value of arr){ console.log(value); }...
2019-04-24 09:21:04
222
原创 JS-15-深拷贝和浅拷贝
1.什么是深拷贝什么是浅拷贝?1.1深拷贝修改新变量的值不会影响原有变量的值；默认情况下基本数据类型都是深拷贝；1.2浅拷贝修改新变量的值会影响原有的变量的值；默认情况下引用类型都是浅拷贝；// 深拷贝 let num1 = 123; let num2 = num1; num2 = 666; // 修改形变量的值 ...
2019-04-23 17:41:11
112
原创 JS-14-对象-属性 / 遍历 / 解构赋值
一、对象属性相关什么是instanceof关键字?instanceof用于判断 “对象” 是否是指定构造函数的 “实例”；instanceof注意点：只要 构造函数的原型对象出现在实例对象的原型链中都会返回true；JavaScript-isPrototypeOf属性1.什么是isPrototypeOf属性： isPrototypeOf用于判断 一个对象是否是另一个对象的原型；...
2019-04-23 17:17:11
1048
原创 JS-13-ES6类和对象 / ES6继承
一、ES6类和对象1.从ES6开始系统提供了一个名称叫做class的关键字, 这个关键字就是专门用于定义类的; class Person{ // 当我们通过new创建对象的时候, 系统会自动调用constructor // constructor我们称之为构造函数 constructor(myName, my...
2019-04-21 22:41:03
217
原创 JS-12-对象-封装 / 继承
私有属性注意点：在给一个对象不存在的属性设置值的时候, 不会去原型对象中查找, 如果当前对象没有就会给当前对象新增一个不存在的属性由于私有属性的本质就是一个局部变量, 并不是真正的属性, 所以如果通过 对象.xxx 的方式是找不到私有属性的, 所以会给当前对象新增一个不存在的属性;2.操作的是公有属性一、JavaScript-封装性局部变量和局部函数:无论是ES6之前还是ES...
2019-04-21 22:37:45
109
原创 JS-11-对象-创建 / 构造函数 / 函数与对象关系
一、JavaScript-创建默认对象1.JavaScript中提供了一个默认的类Object, 我们可以通过这个类来创建对象;2.由于我们是使用系统默认的类创建的对象, 所以系统不知道我们想要什么属性和行为, 所以我们必须手动的添加我们想要的属性和行为;3.如何给一个对象添加属性 ;对象名称.属性名称 = 值;4.如何给一个对象添加行为;对象名称.行为名称 = 函数;例：l...
2019-04-19 15:32:57
269
原创 JS-10-作用域和预解析
一、JavaScript-变量作用域1.在JavaScript中{}外面的作用域, 我们称之为全局作用域；2.在JavaScript中函数后面{}中的的作用域, 我们称之为"局部作用域"；3.在ES6中只要{}没有和函数结合在一起, 那么应该"块级作用域"；4.块级作用域和局部作用域区别；4.1在块级作用域中通过var定义的变量是全局变量；4.2在局部作用域中通过var定义的变量是局部...
2019-04-14 20:36:04
233
原创 JS-9-函数
一、JavaScript函数1.什么是函数?函数是专门用于封装代码的, 函数是一段可以随时被反复执行的代码块;2.函数格式function 函数名称(形参列表){被封装的代码;}3.函数定义步骤1.1 书写函数的固定格式1.2 给函数起一个有意义的名称1.为了提升代码的阅读性2.函数名称也是标识符的一种, 所以也需要遵守标识符的命名规则和规范1.3 确定函数的形参列表...
2019-04-14 20:08:27
194
原创 JS-8-数组
一、JavaScript-数组1.什么是数组?数组就是专门用于存储一组数据的；注意点:和我们前面学习的Number / String / Boolean/ Null / undefined不同(基本数据类型)；而我们今天学习的数组(Array)不是基本数据类型, 是引用数据类型(对象类型)2.如何创建一个数组?let 变量名称 = new Array(size);数组注意点： ...
2019-04-14 16:20:09
262
原创 JS-7-控制语句
一. if语句1. if的格式if(条件表达式){ 条件满足执行的语句;}2. 注意点：对于非布尔类型的数据, 会先转换成布尔类型再判断；对于==/===判断, 将常量写在前面； let num = 10; // if(num = 5){。。} if(5 == num){。。。}if/else if/else后...
2019-04-06 22:01:43
118
原创 JS-6-运算符
16-JavaScript算数运算符注意点加法运算的注意点：1.1 任何非数值类型的数据在参与加法运算之前, 都会被自动的转换成数值类型之后, 再参与运算；1.2 任何数据和NaN进行运算, 结果都是NaN1.3 任何数据和字符串相加, 都会被先转换成字符串之后再运算；1.4 字符串相加的本质就是字符串拼接减法运算的注意点：1.1 任何非数值类型的数据在参与加法运算之前...
2019-04-05 14:05:33
185
原创 JS-5-数据类型转换
12-转换为字符串类型在JavaScript中如果想将（number / boolean / undefined / null）四种基本数据类型转换为字符串类型, 常用的方法有三种:1.对于Number类型和Boolean类型来说, 可以通过 变量名称.toString()的方式来转换,（ toString不能转换undefined和null类型为字符串类型）2.可以通过String(常量...
2019-04-01 10:17:01
224
原创 JS-4-数据类型
11-JavaScript数据类型1.基本数据类型Number 数值类型在JavaScript中无论是整数还是小数都是属于数值类型的String 字符串类型在JavaScript中无论是通过单引号还是通过双引号括起来的内容都是属于字符串类型的Boolean 布尔类型在JavaScript中布尔类型比较特殊, 只有两个取值true/falseUndefined 未定义...
2019-04-01 09:27:03
129
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人