课程地址：https://www.imooc.com/learn/229 一、 常见移动端开发框架简介 二、Zepto框架介绍和入门 三、 Zepto框架核心API 1.Core 2.事件 自定义事件...手机模拟事件 touch.js的第三方插件库 3.zepto ajax 自带的四个模块 4.zepto插件 先了解设计模式 创建插件，扩展 四、移动端简单网页案例 1.移动端案例介绍 ajax请求，dom...节点渲染，事件绑定 2.项目目录结构 后端代码-node.js lib-逻辑方面，views存放一些模板 前端代码-zepto.js libs封装了一些公用方法 和业务相关的代码 发布，多个文件打包压缩
Touch.js 是移动设备上的手势识别与事件库, 由百度云Clouda团队维护，也是在百度内部广泛使用的开发工具。 Touch.js手势库专为移动设备设计。...Touch.js对于网页设计师来说，是一款不错的辅助工具，可以减少很多写框架控制器的时间。 网页合理使用Touch.js不但能增加网页的美观感，而且在节约时间，减少人力投入也有极大的帮助。...Touch.js官网： https://www.awesomes.cn/repo/Clouda-team/touchjs Github 地址： https://github.com/Clouda-team...可以说是Web移动端touch点击事件不错的解决方案，搭配zepto.js或者jQuery使用起来解决了移动端click点击事件300ms的延迟问题。...百度官方touch.js的说明文档，详见：http://cloudajs.org/docs/step4_API_Documentation#h2_7 Touch.js上手还是很容易的，语法： touch.on
一、Zepto简介 ? Zepto是一个轻量级的针对现代高级浏览器的 JavaScript库， 它与jquery有着类似的api。...三、Zepto 模块化 Zepto 有一点和 jQuery 是不同的，就是 Zepto 是分模块的。在使用的时候不是像 jQuery 只需要引入一个 js 文件就可以了。Zepto 是分模块的。...touch.js 在触摸设备上触发tap– 和 swipe– 相关事件。这适用于所有的touch(iOS, Android)和pointer事件(Windows Phone)。...四、Zepto 的定制 Zepto 允许将多个 js 文件打包成一个 js 文件。 操作步骤： 1、安装 Nodejs 环境 2、下载 zepto.js 源码并解压好。.../zepto-master/src/touch.js"> <script src=".
在这里简要整理一些JavaScript在移动端的项目经验，主要包括click点击事件延迟、元素高亮点击区、zepto的touch问题等。...对于这种体验不佳的问题，我们可以使用tap等事件来替代，而tap事件属于模拟类事件，需要引入zepto.js或者百度的touch.js等插件辅助实现。...关于浏览器内核以及浏览器内核前缀可以查看《浏览器内核及内核前缀》 zepto的touch问题 为了处理一些touch事件，我们常会引入zepto等插件进行处理，但是会发现，swipe事件在小米1等低端手机不支持...另一种方法则是放弃zepto了~
alt="" /> zepto.min.js..."> touch.js"> zepto.min.js、touch.js和index.js，其他的文件没有必要说
types string 事件的类型（多为手势事件），可接受多个事件以空格分开；支持原生事件的透传
var Zepto = (function(){ var zepto = {},$; zepto.Z = function(dom, selector) { return...return zepto.Z(dom, selector) } $ = function(selector,context){ return zepto.init...zepto.Z.prototype =Z.prototype= $.fn return $ //返回$,赋值给Zepto })() window.Zepto = Zepto /.../当$未被占用时就把Zepto赋值给$ window.$ === undefined && (window.$ = Zepto) //事件处理模块 ;funciton(){ }(Zepto) /.../Ajax模块 ;function(){ }(Zepto) //表单序列化模块 ;function(){ }(Zepto) 原文地址：http://www.itkaoyan.cn/?
目录 类库和框架的区别 写法 jq操作样式 属性 事件 class dom操作 效果 类库和框架的区别 jq jq是一个功能丰富，轻量级的类库 zepto.js zepto.js 是更轻量级的类库
GMU GMU是基于zepto的mobile UI组件库，提供webapp、pad端简单易用的UI组件! Web App。...ZUI 开源HTML5前端框架 Clouda Touch.js Touch.js是移动设备上的手势识别与事件库,也是在百度内部广泛使用的开发。
在zepto中，通过$来构造对象 $ = function(selector, context){ return zepto.init(selector, context) } 由该函数，实际上...given, return an empty Zepto collection //返回一空的zepto对象 if (!...else dom = zepto.qsa(document, selector) } // create a new Zepto collection from the nodes found...条件判断里的代码需要注意一点，即将dom转成zepto对象.使其能调用$的attr方法，attr函数留在后面。...重新回到init函数，接下来的都是一些条件判断，其中有一个是选择器函数 即zepto.qsa zepto.qsa = function(element, selector){ var found
zepto中的ready函数是作为$.fn的一个方法，即作为一个zepto对象的方法 readyRE = /complete|loaded|interactive/; ready: function(callback...所以在zepto中，必须检测document.readyState的值来判断下一步的进行的动作。
$.inArray(element, array, [fromIndex]) ⇒ number 返回数组中指定元素的索引值（以0为基数），如果没有找到该元素...
这里主要分析zepto事件中的$.on函数，先看一下该函数的代码 $.fn.on = function(event, selector, data, callback, one){ var autoRemove...//callback = function(){return false} if (callback === false) callback = returnFalse //迭代zepto...该函数主要分析的是return 后面的语句，在前面的分析中，分析了each函数和$对象，也就是对$对象中的每一个dom进行绑定事件，这里先跳过autoRemove函数，留在后面分析，如果有传入选择器，zepto...先定义一个delegator函数，delegator函数中有一个match变量，该变量即为我们要绑定事件的目标元素，zepto采用的是事件委托，官方文档对于closest的定义如下： ?...stopPropagation: 'isPropagationStopped' } 在原生的事件属性中，也存在prereventDefault等方法以及判断其值的defaultPrevented属性，但在zepto
可以查看之前写的一篇文章Zepto中数据缓存原理与实现 ,应该可以找到答案 结尾 以上是Zepto中常见的操作元素属性的方法（attr、removeAttr、prop、removeProp、html、...参考 读Zepto源码之属性操作 textContent mdn multiple zepto.js 源码解析 文章记录 ie模块 Zepto源码分析之ie模块(2017-11-03)...data模块 Zepto中数据缓存原理与实现(2017-10-03) form模块 zepto源码分析之form模块(2017-10-01) zepto模块 这些Zepto中实用的方法集(2017-08...-26) Zepto核心模块之工具方法拾遗 (2017-08-30) 看zepto如何实现增删改查DOM (2017-10-2) Zepto这样操作元素属性(2017-11-13) event模块 mouseenter...(2017-06-05) 向zepto.js学习如何手动触发DOM事件(2017-06-07) 谁说你只是"会用"jQuery?
读 Zepto 源码系列文章已经放到了github上，欢迎star: reading-zepto 源码版本 本文阅读的源码为 zepto1.2.0 GitBook 《reading-zepto》 实现的事件...系列文章 读Zepto源码之代码结构 读Zepto源码之内部方法 读Zepto源码之工具函数 读Zepto源码之神奇的$ 读Zepto源码之集合操作 读Zepto源码之集合元素查找 读Zepto源码之操作...DOM 读Zepto源码之样式操作 读Zepto源码之属性操作 读Zepto源码之Event模块 读Zepto源码之IE模块 读Zepto源码之Callbacks模块 读Zepto源码之Deferred...模块 读Zepto源码之Ajax模块 读Zepto源码之Assets模块 读Zepto源码之Selector模块 参考 zepto touch 库源码分析 PointerEvent Pointer events...源码之touch.js addPointer method License 署名-非商业性使用-禁止演绎 4.0 国际 (CC BY-NC-ND 4.0) 作者：对角另一面
color:'darkblue'}}) //Hellow 当页面ready的时候，执行回调： Zepto...0 is: a //ct1.html:18 item 1 is: b //ct1.html:18 item 2 is: c var hah = {name:'zepto.js... $.each(hash,function(key,vaue){ console.log('%s: %s',key,value) }) //name: zepto.js...是一个对象，它拥有Zepto对象上所有的方法，在这个对象上添加一个方法。 ...所有的Zepto 对象上都能用到这个方法。
如果参数是一个Zepto对象集合或者一个元素，结果必须匹配给定的元素而不是选择器。 ...类型:self 添加元素到一个Zepto 对象集合形成一个新数组，如果参数是一个数组，那么这个数组中的元素 将会合并到Zepto对象集合中。 这是一个Zepto 提供的方法。...Zepto 基本实现`data()`只能存储字符串。如果你要存储任意对象，请引入可选的“data”模块到你构建的Zepto中。...如果给定Zepto对象集合或者元素，过滤他们，只有当他们在当前Zepto 集合对象中时，才会被返回。 ...这是一个Zepto提供的方法，不是jquery的API。
这是一个Zepto的方法，不是jquer的api。...collection 过滤当前对象集合，获取一个新的的对象集合，它里面的元素不能匹配css选择器，如果另一个参数为Zepto对象集合，那么返回的新Zepto对象中元素都不包括在该参 数对象中，...SCRIPT"] $.fn.next = function(){ return $(this.pluck('nextElementSibling')) } 这是一个Zepto
langyajiekou，本文属FreeBuf原创奖励计划，未经许可禁止转载 前段时间突然收到一个客户的电话，报告说她的电脑出了问题，所有文件都无法打开了，据她们自己的IT人员发现所有文件都多了一个.zepto...我当时一听到就咯噔一声，糟了，中勒索软件了，zepto是个新的变种，隶属于Locky家族。...好吧，使用“zepto 勒索”才返回了一些关联结果，不过大都是无用的求救信息，参考参考咯。...Zepto勒索软件沿用了它的先辈Locky家族的血统，使用了RSA-2048非对称加密算法，加密后添加.zepto到所属文件并改名成如下格式。
animationEnd 动画结束事件 3、移动端事件框架 例如 zepto touch.js 'swipe', 'swipeLeft', 'swipeRight', 'swipeUp', 'swipeDown...11、 android 上去掉语音输入按钮 input::-webkit-input-speech-button {display: none} 12、移动端基础框架 zepto.js语法与jquery...几乎一样，会jquery基本会zepto； 搭配 backbone underscore http://daneden.github.io/animate.css/ 动画css
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
云直播
