- 博客(111)
- 收藏
- 关注
RSS订阅原创 git submodules
在想要引入模块，但是该工程不支持npm，不支持es6的情况下，可以使用git中的submodules命令进行安装；git submodule add git@github.com/这样就可以将该模块安装到自己的工程下有种情况我们经常会遇到：某个工作中的项目需要包含并使用另一个项目。 也许是第三方库，或者你独立开发的，用于多个父项目的库。 现在问题来了：你想要把它们当做两个独立的项目，同时又想在一个...
2018-03-07 14:32:52
427
转载 移动端问题
1点击穿透问题https://uedsky.com/2016-06/mobile-modal-scroll/2移动端滚动问题iscroll.js的使用3移动端图片的适配 给img设置尺寸，使用rem就可以自适应4移动端布局框架 flexible.js
2017-05-13 10:20:38
436
转载 pushState
一、认识window.historywindow.history表示window对象的历史记录，是由用户主动产生，并且接受javascript脚本控制的全局对象。window对象通过history对象提供对览器历史记录的访问能力。它暴露了一些非常有用的方法和属性，让你在历史记录中自由前进和后退。1、历史记录的前进和后退在历史记录中后退，可以这么做：window.hi
2016-09-23 10:05:22
456
转载 HTTPS是如何工作的
这篇文章来自于我在团队的内部分享。很多人可能不能很好的理解HTTPS，不能理解为什么HTTPS的代码要那样写。因此我写了这片博客，希望能让更多人了解HTTPS。密码（Cipher）Java 1.2内置了一个叫做"JCE"(Java Crytography Extension)的系统。它主要负责Java内部的密钥和证书的管理。众所周知，我们要给一段信息
2016-09-23 08:55:29
443
1
转载 关于dom 事件冒泡、捕获 dom事件三个阶段
本文主要解决两个问题：什么是事件流DOM事件流的三个阶段起因温故了一下我的《JavaScript高级程序设计》的时候，翻到DOM事件那一章，（说实话，现在无论是什么框架你都离不开操作DOM啊，毕竟这是你展示的最基本元素，就像人的细胞）。想起了dom事件流原理，好多人不明白，只知道click mouseout等实用场景，真要理解和更进一步的前端是要
2016-09-22 08:39:19
439
转载 锚点定位
1、使用id定位： 代码如下:锚点1 11111111111 11111111111 11111111111 11111111111 11111111111 11111111111 11111111111 11111111111 11111111111 11111111111 11111111111 1111
2016-09-21 12:47:29
755
原创 arguments.callee
setTimeout(function(){ console.log('1'); setTimeout(arguments.callee,1000); },1000);这里arguments.callee指向匿名函数function(){}定义：argument代表当前函数的参数数组 arguments.callee表示引用当前正在执行的
2016-09-19 19:55:22
448
原创 编码解码的方法
js对文字进行编码涉及3个函数：escape,encodeURI,encodeURIComponent，相应3个解码函数：unescape,decodeURI,decodeURIComponent 1、 传递参数时需要使用encodeURIComponent，这样组合的url才不会被#等特殊字符截断。 例如：document.w
2016-09-19 09:45:51
450
原创 数组的操作
Array 对象属性属性描述constructor返回对创建此对象的数组函数的引用。length设置或返回数组中元素的数目。prototype使您有能力向对象添加属性和方法。Array 对象方法方法描述concat()连接两个或更多的数组，并返回结果。join
2016-09-19 09:28:26
287
转载 两张图解释CSS动画的性能
JS是单线程的，但是浏览器可以开启多个线程，渲染一个网页需要两个重要的线程来共同完成：Main Thread 主线程Compositor Thread 绘制线程(我自己翻译的)主线程的工作：运行JS计算 HTML 元素的 CSS 样式布局页面将元素绘制到一个或多个位图中把这些位图交给
2016-09-17 11:41:55
478
转载 localStoragesessionStorage
1可以用JOSN.stringfiy和JOSN.parse来存储对象2当储存的数据发生变化时，会触发storage事件。我们可以指定这个事件的回调函数。window.addEventListener("storage",onStorageChange);回调函数接受一个event对象作为参数。这个event对象的key属性，保存发生变化的键名。function onStorageC
2016-09-13 08:54:26
325
转载 动画
平时工作中会遇到需要实现一些存在动画的页面。这里对动画的实现知识做一个整理。页面动画的实现可以分为两类：CSS动画、Canvas动画、JavaScript动画。JavaScript动画没啥好讲的，这里就不整理了。CSS动画CSS3中提供了一个属性transition，用来实现CSS样式的平滑变化。举个例子:.box { width: 100px; height: 100px
2016-09-11 18:31:28
312
原创 DOM扩展
选择符APIquerySelector()返回该模式匹配的第一个元素querySelectorAll() 返回所有匹配的元素与类相关document.getElementByClassName(一个或多个类名)classList属性 add(value) 将指定字符串添加到列表中contains 返回布尔值remove 从列表中删除给定的字符
2016-09-08 08:52:58
223
原创 DOM操作
insetBefore(要插入的节点，参照节点)appendChild()replaceChild()removeChild(要插入的节点，要替换的节点)cloneChild(true)深复制，复制该节点的子节点cloneChild()浅复制，只会复制节点本身该方法不会复制添加到DOM节点中的js属性，例如事件处理程序等。这个方法只复制特性、子节点，其他一切都不会复制。
2016-09-07 18:08:46
327
原创 继承
原型链：实例指向——构造函数的原型——父对象构造函数的原型—— functionSuperType(){ this.property= true; } SuperType.prototype.getSuperValue= function(){
2016-09-07 16:31:04
296
原创 location对象和history对象
location对象hashhosthostnamehrefpathnameportprotocolsearch解析查询字符串function query(){ var qs =location.search.length>0 ? location.search.substring(1):'',
2016-09-07 16:21:17
650
原创 定位
不能确定浏览器窗口本身的大小，可以取得页面视口的大小var pageWidth = window.innerWidth; var pageHeight = window.innerHeight; if(typeof pageWidth != 'number'){ if(document.compatMode == 'CSS1C
2016-09-07 14:12:46
235
原创 创建对象
工厂模式function createPerson(name,age,job){ var o=new Object(); o.name = name; o.age = age; o.job = job; o.sayName = function(){ alert(this.name); }; return
2016-09-06 23:06:18
283
原创 数组操作方法
Array对象方法参考：concat 方法:返回一个新数组，这个新数组是由两个或更多数组组合而成的。array1.concat([item1[, item2[, . . . [, itemN]]]])join 方法 :返回字符串值，其中包含了连接到一起的数组的所有元素，元素由指定的分隔符分隔开来。arrayObj.join(separator)与C#不
2016-09-06 18:57:35
364
原创 字符串操作
join('')-参数是分隔符号concat() – 将两个或多个字符的文本组合起来，返回一个新的字符串。 indexOf() – 返回字符串中一个子串第一处出现的索引。如果没有匹配项，返回 -1 。 charAt() – 返回指定位置的字符。 lastIndexOf() – 返回字符串中一个子串最后一处出现的索引，如果没有匹配项，返回 -1 。 match() – 检查一个字
2016-09-06 18:15:27
265
原创 执行环境与作用域
执行环境包括全局执行环境函数执行环境，window对象，因此所有全局变量和函数都是作为window对象的属性和方法创建的。某个执行环境中的所有代码执行完毕后，该环境被销毁， 保存在其中的所有变量和方法也随之销毁（全局执行环境直到应用程序退出——例如关闭网页或浏览器——时才会被销毁）函数执行环境：当执行流进入一个函数时，函数的环境就会被推入一个环境栈中，而在函数执行之后，栈将其环境弹出，把控
2016-09-06 16:52:19
373
转载 ES6模块加载
加载方式规范命令特点运行时加载CommonJS/AMDrequire社区方案，提供了服务器/浏览器的模块加载方案非语言层面的标准只能在运行时确定模块的依赖关系及输入/输出的变量，无法进行静态优化。编译时加载ESMAScript6+import语
2016-09-05 10:38:45
2361
原创 定位相关总结
screenX:鼠标位置相对于用户屏幕水平偏移量，而screenY也就是垂直方向的，此时的参照点也就是原点是屏幕的左上角。clientX:跟screenX相比就是将参照点改成了浏览器内容区域的左上角，该参照点会随之滚动条的移动而移动。pageX：参照点也是浏览器内容区域的左上角，但它不会随着滚动条而变动
2016-09-05 09:33:51
235
转载 为什么url需要编码和解码
针对“name1=value1&name2=value2”我们来说一下客户端到服务端的概念上解析过程: 上述字符串在计算机中用ASCII吗表示为： 6E616D6531 3D 76616C756531 26 6E616D6532 3D 76616C756532。 6E616D6531：name1 3D：= 76616C756531：value1
2016-09-03 12:38:03
4607
原创 前端路由与后端路由
后端路由 意味着 浏览器刷新页面。显然很多 webapp 的需求上是不希望这样的体验的。网速慢的话说不定屏幕全白再有新内容。前端路由就不会有这样的问题了。随意控制，逻辑也可以都放在前端。前端慢慢复杂化，自己的路由这种东西是必不可少的啦。从性能和用户体验的层面来比较的话，后端路由每次访问一个新页面的时候都要向服务器发送请求，然后服务器再响应请求，这个过程肯定会有延迟。而前端路由在访问一个新页
2016-09-03 10:03:27
6989
转载 前端数据模板引擎
前端数据模板引擎的总结2016-09-02 前端大全作者：jingwhale链接：http://www.cnblogs.com/jingwhale/p/5811800.html模板的工作原理可以简单地分成两个步骤：模板解析（翻译）和数据渲染。这两个步骤可分别部署在前端或后端来执行。如果放在后端执行，则是像Smarty，Fr
2016-09-02 20:53:45
1682
原创 回流与重绘
回流与重绘1. 当render tree中的一部分(或全部)因为元素的规模尺寸，布局，隐藏等改变而需要重新构建。这就称为回流(reflow)。每个页面至少需要一次回流，就是在页面第一次加载的时候。在回流的时候，浏览器会使渲染树中受到影响的部分失效，并重新构造这部分渲染树，完成回流后，浏览器会重新绘制受影响的部分到屏幕中，该过程成为重绘。2. 当render tree中的一些元素需要
2016-09-02 17:12:12
2340
原创 call和apply及bind应用
call 的第二个参数可以是任意类型，而apply的第二个参数必须是数组，也可以是arguments应用：实现继承function Animal(name){ this.name = name; this.showName = function(){ alert(this.name); }
2016-09-02 15:42:17
389
转载 GPU加速will-change
如果你注意到在webkit的浏览器上“flicker”一些CSS操作（尤其是变形和动画方面的）的表现，你很可能之前就注意过硬件加速了CPU、GPU和硬件加速硬件加速意味着Graphics Processing Unit（GPU）会通过代替Central Processing Unit (CPU)做一些负荷比较大的事情，来协助浏览器快速渲染页面，当CSS操作使用硬件加速的时候，通
2016-09-02 15:38:36
476
转载 z-index
元素的position属性要是relative，absolute或是fixed时候z-index才可以设置，否则不可以设置。http://www.zhangxinxu.com/wordpress/2016/01/understand-css-stacking-context-order-z-index/
2016-09-02 15:35:49
217
原创 jsonp
后端代码 $callback = $_GET['callback'];//得到回调函数的名称$data = array('a','b');echo $callback.'('.json_encode($data).')'; ?>
2016-09-01 12:10:21
194
转载 DOM操作
1、DOM中的所有节点都继承自Node类型，IE9之前将DOM节点作为COM对象来实现；每个DOM节点都有一个nodeType属性来表明节点类型，总共有12个类型： 1 Node.ELEMENT_NODE 2 Node.ATTRIBUTE_NODE 3 Node.TEXT_NODE 4 Node.CDATA_SECTION_NODE 5 Node.ENTITY_REFERENC
2016-09-01 11:38:18
237
转载 详解URL的组成
很久很久以来，我对浏览器地址栏的信息了解的甚少，只知道域名（估计不知道是这么叫）。唉。。。真是很汗颜啊！在软件专业都混了两年了，还是个菜鸟。说真的，有的时候觉得计算机这个领域真的真的有太多的东西要学了，而且发展速度又那么快。但，这已经是无法改变的事实了，对于我只能是硬着头皮努力的往前走下去，我相信会有成功的一天！最近一段时间都在学javascript，书上有讲到URL方面的一点知识。然后我又查了其
2016-08-30 19:22:35
287
原创 RESTful
Respresentational State Transfer 表现层状态转化它的设计哲学主要讲服务器端提供的内容实体看做一个资源，并表现在url上比如一个用户的地址为：/users/jack这个地址代表了一个资源，对这个资源的操作，主要体现在HTTP请求方法上，不是体现在url上REST的设计就是，通过URL设计资源、请求方法定义资源的操作，通过Accept决定资源的表现形式
2016-08-29 21:47:07
329
转载 target与currentTarget
target在事件流的目标阶段；currentTarget在事件流的捕获，目标及冒泡阶段。只有当事件流处在目标阶段的时候，两个的指向才是一样的， 而当处于捕获和冒泡阶段的时候，target指向被单击的对象而currentTarget指向当前事件活动的对象（一般为父级）。比如说现在有A和B， A.addChild(B) A监听鼠标点击事件 那么当点击B时，target是B，curre
2016-08-25 19:58:24
301
转载 http请求头和响应体信息
1)请求(客户端->服务端[request]) GET(请求的方式) /books/java.html(请求的目标资源) HTTP/1.1(请求采用的协议和版本号) Accept: */*(客户端能接收的资源类型) Accept-Language: en-us(客户端接收的语言类型) Connection: Keep-Alive(维护客户端和服务端的连接关系
2016-08-24 17:21:55
1694
转载 http状态码
HTTP 204(no content)表示响应执行成功，但没有数据返回，浏览器不用刷新，不用导向新页面。HTTP 205(reset content) 表示响应执行成功，重置页面（Form表单），方便用户下次输入。使用ajax时，当只需要知道响应成功或失败的情况，则可以使用状态码HTTP 204来代替HTTP 200，减少多余的数据传输。例子：ajax提交用户名、文章id，记
2016-08-24 17:05:17
565
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人