02 2017 档案

仔细认识setInterval
摘要：参照http://www.w3cplus.com/javascript/javaScript-setInterval.html 作为拥有广泛应用场景(定时器，轮播图，动画效果，自动滚动等等)，而又充满各种不确定性的这setInterval()，自当先洞悉它，才能很好的驾驭它 setInterval( 阅读全文
posted @ 2017-02-28 17:31 花.花 阅读(319) 评论(0) 推荐(0)
仔细认识setTimeout
摘要：参照晚晴幽草轩轩主<<你所不知道的setTimeout>> 参照愚人码头的<<你所不了解的setTimeout>> 仔细认识setTimeout setTimeout的基础 setTimeout表示在指定时间后执行某函数或某代码,返回一个定时器的编号,以便于取消它. 注意:如果放代码的话,必须是字符 阅读全文
posted @ 2017-02-28 16:36 花.花 阅读(464) 评论(0) 推荐(1)
单方向指定时间内的匀速运动
摘要：回忆匀速运动: y = kx + b;这里的各参数表示的含义:k:其实是速度,总路程/总时间x:表示经过的时间b:表示一开始所在的位置y:表示当经过的时间是x的时候,走过的路程 用函数表示 现在想让一个盒子用500ms从left=10匀速运动到20.这里有一个问题,就是如果500ms的时候,对应的距 阅读全文
posted @ 2017-02-21 17:53 花.花 阅读(263) 评论(0) 推荐(0)
图片延迟加载
摘要：因为网页加载图片相对其他来说耗时间,且不是最重要的,所以一般会优先显示内容,其次显示图片 1.想要图片不加载,属性src不写就是,但是因为过会依然显示,所以自定义属性存src的值,等会只需赋值即可 因为图片没有src的话,有些浏览器会显示小碎片,超丑,所以提前隐藏掉. 2.因为有时候,各种手误可能会 阅读全文
posted @ 2017-02-20 16:23 花.花 阅读(498) 评论(0) 推荐(0)
优化网页上的gif
摘要：像很多人一样，我也喜欢gif。我经常在文章中用它们来解释一些功能.比如说，在我的“Recreating the iTunes Library”文章中用到的很多gif，下图是其中之一 但是，问题来了，gif文件很大，上面那张的原始大小就超过了11.4MB(注意:上面的那张不是原图，我压缩了了下，不然真 阅读全文
posted @ 2017-02-17 16:13 花.花 阅读(1275) 评论(0) 推荐(0)
js异步编程
摘要：参考http://www.ruanyifeng.com/blog/2012/12/asynchronous%EF%BC%BFjavascript.html 异步和同步编程思想:做一份卷子的时候,遇到一道难题,同步会仔细想直到解决了才去做下一题,异步是直接跳过这题,然后把其他的都做完了,再做这个难题 阅读全文
posted @ 2017-02-16 17:37 花.花 阅读(193) 评论(0) 推荐(0)
换行和省略号
摘要：参考https://segmentfault.com/a/1190000000471925 1.学下英语 word wrap意思是自动折行 pre是preserve的缩写,意思是保留 2.认识下默认的情况 默认情况: 3.white-space white-space是作用于空格和回车上的，用于控制 阅读全文
posted @ 2017-02-14 15:25 花.花 阅读(655) 评论(0) 推荐(0)
scroll系列
摘要：1.scrollTop是指当前盒子滚动条上面的高度,而clientHeight是指当前盒子一屏幕的高度,然后整个盒子的全部高度是scrollHeight,那么屏幕外的所有高度是scrollHeight-clientHeight,仔细想下,scrollTop的最大值也是这个,最小值是0 2.回到顶部, 阅读全文
posted @ 2017-02-13 16:12 花.花 阅读(648) 评论(0) 推荐(0)
盒子的偏移量
摘要：盒子相对于offsetParent偏移量:offsetLeft,offsetTop. offsetParent:盒子向上找的第一个有定位的元素,没有就是body,body的offsetParent是null 现在,想求任意盒子相对body的偏移量.<!DOCTYPE html> 阅读全文
posted @ 2017-02-10 17:19 花.花 阅读(210) 评论(0) 推荐(0)
设置和获取样式
摘要：1.设置样式,利用元素的style属性设置 2.读取样式:style , window.getComputedStyle , window.currentStyle 1) style属性的确是可读写的,但是读取时,只限制行内样式,即 < p style="width:200px">,只能获得这里行内 阅读全文
posted @ 2017-02-09 17:52 花.花 阅读(350) 评论(0) 推荐(1)
Anywhere 随启随用的静态文件服务器
摘要：转载自https://github.com/JacksonTian/anywhere Running static file server anywhere. 随时随地将你的当前目录变成一个静态文件服务器的根目录。 安装(提前安装node) 使用 阅读全文
posted @ 2017-02-09 11:53 花.花 阅读(530) 评论(0) 推荐(0)
盒子模型
摘要：盒子模型:通过js中提供的一系列属性和方法,获取页面中元素的样式信息值(不指是css样式,是渲染出来的样式) 容器的高度: 现在有一个p标签, 1) 如果我们没有给这个p设定高度,里面的文字也会自行撑开一个高度,这时候容器的高度也就是内容的高度 2) 如果我们设定了p的高度,那么容器的高度就是设定的 阅读全文
posted @ 2017-02-08 16:58 花.花 阅读(170) 评论(0) 推荐(0)
replace的应用
摘要：1.将数字字符串变成大写的汉字,eg:"123" => "壹贰叁" 2.模板引擎的初步原理,eg:"my name is {0},my age is {1},i come from {2},i love {3}~~",然后将数组对应项一一放进去["一问", 28, "湖南", "js"],然后得到完 阅读全文
posted @ 2017-02-08 11:56 花.花 阅读(296) 评论(0) 推荐(0)
replace的理解
摘要：replace是字符串对象的公有方法, str.replace(findStr,newStr) replace:把字符串里符合规则的部分替换成新的部分. 先讨论第一个参数,也就是规则 1.规则是字符串的情况,每当执行一次只能替换一次. 2.规则是正则的情况,和exec捕获一样,把所有和我们正则匹配的 阅读全文
posted @ 2017-02-07 14:18 花.花 阅读(413) 评论(0) 推荐(0)
正则的分组
摘要：正则分组的作用: 1.改变优先级 2.分组引用 3.分组捕获 细说下. 1.改变优先级 2.分组引用 \2表示第二个分组,\1表示第一个分组,但是\2必须在出现在第二个分组的后面,因为只有知道第二个分组是,我才知道\2是啥 这里特别注意,\2的内容和第二个分组的内容必须一模一样 举例说明 3.分组捕 阅读全文
posted @ 2017-02-07 11:37 花.花 阅读(2770) 评论(0) 推荐(0)
正则的捕获
摘要：正则的捕获:exec,返回的结果是数组或null 先看个demo 如果你第一次用exec,估计你是猜不到答案的 捕获的结果是一个数组,因为有符合正则的字符串,但是只有一个,而且还是123,不是1,或者12之类的. 这里涉及到捕获的两个特点:贪婪性和懒惰性. 所谓的贪婪性:每次匹配按照匹配最长的结果捕 阅读全文
posted @ 2017-02-07 09:58 花.花 阅读(465) 评论(1) 推荐(1)
正则创建方式的区别
摘要：创建正则有两种方式:字面量方式创建和实例化方式创建 区别主要两个吧. 1.同时匹配数字 字面量:/\d/ 实例化:new RegExp("\\d") 也就是多了一个转义,"\d"只是匹配"\d",如果想匹配数字的话,也就是转义下,"\\d",也就是\d其实是一种元字符 2.有变量的时候 很显然,字面 阅读全文
posted @ 2017-02-06 16:49 花.花 阅读(485) 评论(0) 推荐(0)
css书写模式
摘要：参考 http://web.jobbole.com/90120/,以下均是个人理解. 1.先说单个字方向,多数语言的字是向上的,比如我现在写的,也有向右的,基本就这两个方向 (专业词:字符方向) 2.字组成行的时候,三个方向,横着的,从左到右和从右到左,竖着的,从上到下 (专业词:行内方向) 3.行 阅读全文
posted @ 2017-02-06 15:46 花.花 阅读(298) 评论(0) 推荐(0)
正则的应用和小技巧
摘要：1.表示有效数字 思路:组成元素 +-,整数部分,小数部分 最开头+-可以出现或者不出现 整数部分,一位数可以是0-9,多位数的话不能以0开头 可以出现小数点也可以不出现,出现的话前后必须有数字 于是 [+-]? (\d|[1-9]\d+) (\.\d+)? 合成:/^[+-]?(\d|[1-9]\ 阅读全文
posted @ 2017-02-04 17:40 花.花 阅读(116) 评论(0) 推荐(0)
正则的用处和语法
摘要：正则:就是处理字符串的一个规则 用处: 1.匹配:字符串是否匹配规则,返回值是布尔值(test) 2.捕获:捕获字符串中符合规则的部分,返回值是null或数组(exec) 组成:元字符和修饰符 正则的构建:字面量(/\d/)和实例创建(new RegExp("\\d")),两者有区别,区别另说,常用 阅读全文
posted @ 2017-02-04 15:53 花.花 阅读(317) 评论(0) 推荐(0)
DOM的映射机制
摘要：DOM映射:页面中的标签和js中获取到的元素对象或者元素集合是紧紧的绑定在一起的 页面中html结构改变了,js中不需要重新获取,集合里面的内容也会跟着自动改变 需要注意的是,如果将集合变成数组,这个将失效,如这里将 olis = Array.prototype.slice.call(olis);这 阅读全文
posted @ 2017-02-04 14:39 花.花 阅读(343) 评论(0) 推荐(0)
数据绑定
摘要：说两个概念,回流和重绘 回流:当html结构发生改变,如增删元素 位置发生改变 等,这样浏览器需要重新的计算一遍最新的DOM结构,从而重新的对当前的页面进行渲染 重绘:某一个元素的部分样式发生变化 浏览器只需要重新渲染当前元素 列表的数据一般都是从接口来的 假设是ul>li的布局,有三种绑定数据的方 阅读全文
posted @ 2017-02-04 11:12 花.花 阅读(210) 评论(0) 推荐(0)
sort
摘要：sort() 方法在适当的位置对数组的元素进行排序，并返回排序后的数组。 sort 排序不一定是稳定的。默认排序顺序是根据字符串Unicode码点。 sort里面的回调函数,有两个参数,第一个参数表示数组的当前元素和第二个参数表示下一个元素,返回值是正数的话 当前元素和下一个元素调换位置. 仔细研究 阅读全文
posted @ 2017-02-03 17:49 花.花 阅读(305) 评论(0) 推荐(0)
捕获异常
摘要：try catch finally throw try{ // code1 }catch(e){ // code1有错误的话,会执行catch里面的代码code2,e是code1里面报的错,必须带这个参数 // code2 }finally{ // code1 有没有错,都会执行finally里面的 阅读全文
posted @ 2017-02-03 16:22 花.花 阅读(128) 评论(0) 推荐(0)
数组和字符串的相互转换
摘要：1.字符串变成数组,split 2.数组变字符串,join 玩个有点好玩的,将数组里面的数字求和 阅读全文
posted @ 2017-02-03 15:42 花.花 阅读(302) 评论(0) 推荐(0)
严格模式
摘要：参考http://www.ruanyifeng.com/blog/2013/01/javascript_strict_mode.html 严格模式的目的:更严谨,更安全,更合理 1.两种调用方式 a.在脚本的第一行 "use strict",表明整个脚本都将以"严格模式"运行 b.在函数内部的第一行 阅读全文
posted @ 2017-02-03 14:17 花.花 阅读(175) 评论(0) 推荐(0)
排序,求最大值最小值
摘要：1.假设法,假设第一个值是最大值和最小值 2.sort,数组的sort的方法,sort的回调函数,返回值是正的就会调换参数顺序,也就是 a-b>0 ,那么参数的a,b在数组中的顺序就会被调换,也就是b,a 3.Math.min(a,b,c...),Math.max(a,b,c...),找到参数中的最 阅读全文
posted @ 2017-02-03 11:45 花.花 阅读(1125) 评论(0) 推荐(0)
原型继承
摘要：上面是普通方法 父类的私有和公有属性都变成子类的公有属性 下面的call继承,父类的所有方法都变成子类的私有属性 阅读全文
posted @ 2017-02-03 10:33 花.花 阅读(119) 评论(0) 推荐(0)