03 2017 档案

Javascript跨域
摘要:同源策略限制从一个源加载的文档或脚本如何与来自另一个源的资源进行交互。 什么是源? 如果协议,端口(如果指定了一个)和主机对于两个页面是相同的,则两个页面具有相同的源。 如下:http://store.company.com:8080/dir/page.html 协议为:http: 端口为:8080 阅读全文

posted @ 2017-03-30 22:45 菜的黑人牙膏 阅读(219) 评论(0) 推荐(0)

backbond Model方法(set)
摘要:backbond的Model,其中存在一些操作属性的方法,而在这些方法中,最重要的就是set方法,其余的方法大部分都基于这个方法实现的,在backbond开发版中,也说了该方法是model中的核心方法。 在分析之前,先看一下官方文档的描述: 也就是说,可以传入{key-value}{obj}两个对象 阅读全文

posted @ 2017-03-28 20:38 菜的黑人牙膏 阅读(584) 评论(0) 推荐(0)

backbond Model实现
摘要:backbond中的M,指的是模型,即存放数据以及数据相关逻辑的单位。在分析其结构之前,先看一下其调用过程。 backbond 通过Backbone.Model.extend方法得到一个World类(为了不让World和其实例化结果混淆,这里把World称为类,实例化结果称为对象),再通过实例化Wo 阅读全文

posted @ 2017-03-26 16:47 菜的黑人牙膏 阅读(299) 评论(0) 推荐(0)

backbond整体架构
摘要:原文地址:https://segmentfault.com/a/1190000006697372 阅读全文

posted @ 2017-03-26 14:51 菜的黑人牙膏 阅读(493) 评论(0) 推荐(0)

zepto 事件分析4(事件队列)
摘要:前面分析了zepto的事件绑定,接下来分析事件解绑,先看一下zepto中解绑的off方法: offf方法前面大致和on方法一样,最主要的是最后return里面的remove函数,在看remove之前,要先分析之前遇到的有关handler的函数,下面是在add方法中,关于handler的。 首先通过z 阅读全文

posted @ 2017-03-25 10:37 菜的黑人牙膏 阅读(278) 评论(0) 推荐(0)

zepto 事件分析3(add函数)
摘要:在上一篇的分析中,最后$.on方法返回了一个add方法函数的执行,在这里先看一下其代码: 在这里先跳过id以及handler部分(handler.e的值即为事件的type属性),该函数主要作用就是将事件添加进元素的事件队列里。 首先是对events进行分割成多个事件,并通过each函数逐个绑定。先来 阅读全文

posted @ 2017-03-24 22:57 菜的黑人牙膏 阅读(327) 评论(0) 推荐(0)

zepto 事件分析2($.on)
摘要:这里主要分析zepto事件中的$.on函数,先看一下该函数的代码 该函数主要分析的是return 后面的语句,在前面的分析中,分析了each函数和$对象,也就是对$对象中的每一个dom进行绑定事件,这里先跳过autoRemove函数,留在后面分析,如果有传入选择器,zepto先定义一个delegat 阅读全文

posted @ 2017-03-24 22:17 菜的黑人牙膏 阅读(773) 评论(0) 推荐(0)

zepto 事件分析1($.Event)
摘要:先看一下zepto事件的函数,在这里,zepto是把zepto对象作为一个立即执行函数的参数传进去的。 在zepto事件函数中,主要为$.Event,$.on,$.off等,分析事件代码,分析这三个就够了,首先分析$.Event函数,在分析该函数之前,从接口文档中大概知道这是一个创建事件的方法,可以 阅读全文

posted @ 2017-03-24 21:33 菜的黑人牙膏 阅读(607) 评论(0) 推荐(0)

zepto中的属性设置
摘要:上次看zepto的init方法时,有一段属性设置的代码,先来看看其表现: 在分析这里的时候,一直很困惑,为什么实例化dom之后,对nodes进行属性设置会导致dom也有了属性设置的结果。回想了一下,在javascript中,对象是引用,而不是赋值,而dom不是zepto对象就是Dom对象,假如是ze 阅读全文

posted @ 2017-03-21 21:56 菜的黑人牙膏 阅读(3400) 评论(0) 推荐(0)

zepto的ready方法
摘要:zepto中的ready函数是作为$.fn的一个方法,即作为一个zepto对象的方法 ready返回的是this,即调用ready的自身对象。 一开始,对于采用if else语句不太了解,不清楚为什么要用两种方式调用回调函数。 在MDN中,有这样的描述: document.readyState有三个 阅读全文

posted @ 2017-03-19 22:19 菜的黑人牙膏 阅读(2321) 评论(0) 推荐(0)

zepto的构造器$
摘要:在zepto中,通过$来构造对象 由该函数,实际上,在调用$函数时相当于调用init方法,接下来看init函数: 先来看一下当传入的是一个html标签的字符串时的构造过程: fragmentRE是一个匹配普通标签<xxx>的表达式,关键是zepto.fragment()函数。 该函数传入三个参数,在 阅读全文

posted @ 2017-03-19 11:54 菜的黑人牙膏 阅读(237) 评论(0) 推荐(0)

Zepto整体概况
摘要:var Zepto = (function(){ var zepto = {},$; zepto.Z = function(dom, selector) { return new Z(dom,selector) } zepto.init = function(selector,context){ . 阅读全文

posted @ 2017-03-18 21:40 菜的黑人牙膏 阅读(165) 评论(0) 推荐(0)

垂直水平居中
摘要:源代码: 运行图: 1.使用表格法: 运行图: 缺点:子元素的会撑满父元素。 2.绝对定位计算:对子元素使用绝对定位,并分别移动上左50%,再分别margin-top:-50%height px,margin-left:-50%width px; 运行图: 缺点:需要对子元素的宽高固定,并且绝对定位 阅读全文

posted @ 2017-03-12 21:22 菜的黑人牙膏 阅读(164) 评论(0) 推荐(0)

异步加载脚本保持执行顺序
摘要:首先是外部脚本和行内脚本,对于异步加载的脚本,会导致竞争状态,使得出现未定义的错。 采用Script Dom技术测试: 代码: 运行结果: 以下几种方式解决该问题: 1.硬编码回调 将test方法的执行定义在外部脚本(即调用的脚本),该方法不灵活,如果调用的是第三方脚本的话,更加麻烦。此处不显示例子 阅读全文

posted @ 2017-03-08 11:39 菜的黑人牙膏 阅读(1724) 评论(0) 推荐(0)

无阻塞加载脚本
摘要:通常加载页面的时候,对于组件是并行下载的,现代大部分浏览器对于Js同样也是支持并行下载,但是在脚本下载、解析并执行完毕之前,不会开始下载任何其他内容。 正常引入: 可以看出,在脚本下载完毕后的一段时间内(该时间在解析执行脚本),不会对其他组件进行下载,以下几种方案解决该问题。 1. XHR Eval 阅读全文

posted @ 2017-03-07 21:49 菜的黑人牙膏 阅读(198) 评论(0) 推荐(0)

导航