一, 同
Zepto 最初是为移动端开发的库, 是 jQuery 的轻量级替代品, 因为它的 API 和 jQuery 相似, 而文件更小.
Zepto 最大的优势是它的文件大小, 只有 8k 多, 是目前功能完备的库中最小的一个, 尽管不大, Zepto 所提供的工具足以满足开发程序的需要.
大多数在 jQuery 中常用的 API 和方法 Zepto 都有, Zepto 中还有一些 jQuery 中没有的. 另外, 因为 Zepto 的 API 大部分都能和 jQuery 兼容, 所以用起来极其容易, 如果熟悉 jQuery, 就能很容易掌握 Zepto.
你可用同样的方式重用 jQuery 中的很多方法, 也可以方面地把方法串在一起得到更简洁的代码, 甚至不用看它的文档.
(相关课程推荐: jQuery 教程 https://www.html.cn/jskuangjia/jquery/ )
二, 异
1, 针对移动端程序, Zepto 有一些基本的触摸事件可以用来做触摸屏交互(tap 事件, swipe 事件),Zepto 不支持 IE 浏览器.
因为 Zepto 使用 jQuery 句法, 所以它在文档中建议把 jQuery 作为 IE 上的后备库. 那样程序仍能在 IE 中, 而其他浏览器则能享受到 Zepto 在文件大小上的优势, 然而它们两个的 API 不是完全兼容的, 所以使用这种方法时一定要小心, 并要做充分的测试.
2,Dom 操作的区别: 添加 id 时 jQuery 不会生效而 Zepto 会生效.
3, 事件触发的区别: 使用 jQuery 时 load 事件的处理函数不会执行; 使用 Zepto 时 load 事件的处理函数会执行.
4, 事件委托的区别: Zepto 中, document 上所有的 click 委托事件都依次放入到一个队列中, 点击的时候先看当前元素是不是. a, 符合则执行, 然后查看是不是 b, 符合则执行. 而在 jQuery 中, document 上委托了 2 个 click 事件, 点击后通过选择符进行匹配, 执行相应元素的委托事件.
5,width()和 height()的区别: Zepto 由盒模型 (box-sizing) 决定, 用. width()返回赋值的 width, 用. CSS('width')返回加 border 等的结果; jQuery 会忽略盒模型, 始终返回内容区域的宽 / 高(不包含 padding,border).
6,offset()的区别: Zepto 返回{top,left,width,height};jQuery 返回{width,height}.
7,Zepto 无法获取隐藏元素宽高, jQuery 可以.
8,Zepto 中没有为原型定义 extend 方法而 jQuery 有.
9,Zepto 的 each 方法只能遍历 数组, 不能遍历 JSON 对象.
10,Zepto 在操作 dom 的 selected 和 checked 属性时尽量使用 prop 方法, 在读取属性值的情况下优先于 attr.Zepto 获取 select 元素的选中 option 不能用类似 jQuery 的方法 $('option[selected]'), 因为 selected 属性不是 CSS 的标准属性. 应该使用 $('option').not(function(){ return !this.selected }).
本文来自 jQuery 答疑 https://www.html.cn/qa/jquery/ 栏目, 欢迎学习!
来源: http://www.css88.com/qa/jquery/15469.html