Zepto.js简介
Zepto.js简介
一、总结
一句话总结:
Zepto.js语法和jquery起码百分之90相似,主要做移动端框架,和jquery mobile是一个类型的概念
1、Zepto.js做移动端的特点?
Zepto有着独特的手指的触摸事件(tap、swipe。。。),且不再支持IE浏览器
2、移动端常用框架?
1.jQuery Mobile
2.zepto.js
3.bootstrap做适配
二、什么是Zepto.js
转自或参考:什么是Zepto.js
https://blog.csdn.net/qq_38021852/article/details/82659994
Zepto是一个轻量级的JavaScript库,它的文件大小只有10K左右,兼容现代高级浏览器,主要用于移动端的开发,它有着与jQuery类似的API。就像zepto官网说的如果你会使用jQuery,那你也会用zepto。
Zepto有着独特的手指的触摸事件(tap、swipe。。。),且不再支持IE浏览器。
下载方式:npm install zepto
下载到本地:https://zeptojs.com/zepto.js
中文文档地址:http://www.css88.com/doc/zeptojs_api/
浏览器支持
初级 (100% 支持)
- Safari 6+ (Mac)
- Chrome 30+ (Windows, Mac, Android, iOS, Linux, Chrome OS)
- Firefox 24+ (Windows, Mac, Android, Linux, Firefox OS)
- iOS 5+ Safari
- Android 2.3+ Browser
- Internet Explorer 10+ (Windows, Windows Phone)
次要目标(完全或大部分支持)
- iOS 3+ Safari
- Chrome <30
- Firefox 4+
- Safari <6
- Android Browser 2.2
- Opera 10+
- webOS 1.4.5+ Browser
- BlackBerry Tablet OS 1.0.7+ Browser
- Amazon Silk 1.0+
- Other WebKit-based browsers/runtimes
创建插件:
核心方法
$()
$(selector, [context]) ⇒ collection
$(<Zepto collection>) ⇒ same collection
$(<DOM nodes>) ⇒ collection
$(htmlString) ⇒ collection
$(htmlString, attributes) ⇒ collection v1.0+
Zepto(function($){ ... })
jQuery与Zepto的异同
一,同:
Zepto最初是为移动端开发的库,是jQuery的轻量级替代品,因为它的API和jQuery相似,而文件更小。Zepto最大的优势是它的文件大小,只有8k多,是目前功能完备的库中最小的一个,尽管不大,Zepto所提供的工具足以满足开发程序的需要。大多数在jQuery中·常用的API和方法Zepto都有,Zepto中还有一些jQuery中没有的。另外,因为Zepto的API大部分都能和jQuery兼容,所以用起来极其容易,如果熟悉jQuery,就能很容易掌握Zepto。你可用同样的方式重用jQuery中的很多方法,也可以方面地把方法串在一起得到更简洁的代码,甚至不用看它的文档。
二,异:
1,针对移动端程序,Zepto有一些基本的触摸事件可以用来做触摸屏交互(tap事件、swipe事件),Zepto是不支持IE浏览器的,这不是Zepto的开发者Thomas Fucks在跨浏览器问题上犯了迷糊,而是经过了认真考虑后为了降低文件尺寸而做出的决定,就像jQuery的团队在2.0版中不再支持旧版的IE(6 7 8)一样。因为Zepto使用jQuery句法,所以它在文档中建议把jQuery作为IE上的后备库。那样程序仍能在IE中,而其他浏览器则能享受到Zepto在文件大小上的优势,然而它们两个的API不是完全兼容的,所以使用这种方法时一定要小心,并要做充分的测试。
移动端常用框架
1.jQuery Mobile
2.zepto.js
3.bootstrap做适配
Zepto.js简介的更多相关文章
- 学习zepto.js(对象方法)[5]
继续说. clone: 该方法不接收任何参数,会返回对象中的所有元素集合,但不会对象绑定的事件. var $temp = $("div").clone(); //并不接收任何参数. ...
- 学习zepto.js(对象方法)[3]
继续说zepto里attributes的相关操作. attr,removeAttr,prop这三个方法. attr(): 三种用途 get: 返回值为一个string字符串 $("<s ...
- prototype.js简介
prototype.js简介 2007-11-21 14:22 prototype.js是一个很强大的Javascript函数库,它可以让你很轻松的使用一些特效,实现AJAX的功能.虽然prototy ...
- 将jquery.shCircleLoader插件修改为zepto.js兼容
经过查阅资料zepto 和 jquery 的区别后发现是 (1)zepto.js 删去了 jquery 的 innerHeight() 和 innerWidth() 属性 (2)zepto.js和 ...
- scroll事件实现监控滚动条并分页显示示例(zepto.js)
scroll事件实现监控滚动条并分页显示示例(zepto.js ) 需求:在APP落地页上的底部位置显示此前其他用户的购买记录,要求此div盒子只显示3条半,但一页有10条,div内的滑动条滑到一页 ...
- 学习zepto.js(Hello World)
Zepto是一个轻量级的针对现代高级浏览器的JavaScript库, 它与jquery有着类似的api. 如果你会用jquery,那么你也会用zepto. 昨天听说了zepto.js,正好最近也比较闲 ...
- zepto.js的事件处理
能够深入理解zepto对事件的处理,那么整个JS的事件处理就应该差不多合格了,事件处理是JS语言的一个难点. 1. 首先来看$.event函数. JS中有很多事件,都是已经定义好了,我们直接调用就可以 ...
- Zepto.js touch模块深入分析
目的:记录 Zepto.js touch模块 源码阅读 源码: // Zepto.js // (c) 2010-2015 Thomas Fuchs // Zepto.js may be freely ...
- HTML基础--JS简介、基本语法、类型转换、变量、运算符、分支语句、循环语句、数组、函数、函数调用.avi
JS简介 1.JavaScript是个什么东西? 它是个脚本语言,需要有宿主文件,它的宿主文件是HTML文件. 2.它与Java什么关系? 没有什么直接的联系,Java是Sun公司(已被Oracle收 ...
随机推荐
- Dockerfile常用指令说明
具体解释:https://blog.csdn.net/achenyuan/article/details/80231922 将dockerfile文件和生成好的jar 使用ftp工具上传到linux服 ...
- 打开nginx配置的站点报错500
打开站点报错500的原因 有很多,这里只说明一点:nginx 的fastcgi.conf配置引起的问题 环境说明 1 站点目录结构 wwwroot website public application ...
- CentOS 7.7安装Erlang和Elixir
安装之前,先看一下它们的简要说明 Erlang Erlang是一种开源编程语言,用于构建对高可用性有要求的大规模可扩展的软实时系统.它通常用于电信,银行,电子商务,计算机电话和即时消息中.Erlang ...
- 十分钟读懂JavaScript原型和原型链
原型(prototype)这个词来自拉丁文的词proto,意谓“最初的”,意义是形式或模型.在JavaScript中,原型的探索也有很多有趣的地方,接下来跟随我的脚步去看看吧. 原型对象释义 每一个构 ...
- AVR单片机教程——EasyElectronics Library v1.3手册
bit.h delay.h pin.h wave.h pwm.h tone.h adc.h button.h switch.h rotary.h pot.h ldr.h led.h rgbw.h se ...
- Huber Loss 介绍
Huber Loss 是一个用于回归问题的带参损失函数, 优点是能增强平方误差损失函数(MSE, mean square error)对离群点的鲁棒性. 当预测偏差小于 δ 时,它采用平方误差,当预测 ...
- SpringBoot中使用Interceptor
https://www.cnblogs.com/chao555/p/9573102.html 1.创建自定义的拦截器并实现HandlerInterceptor接口 package com.demo.c ...
- 2.NET Core设定数据库种子
1.使用以下代码在 Models 文件夹中创建一个名为 SeedData 的新类: using Microsoft.EntityFrameworkCore;using Microsoft.Extens ...
- pyspark学习笔记
记录一些pyspark常用的用法,用到的就会加进来 pyspark指定分区个数 通过spark指定最终存储文件的个数,以解决例如小文件的问题,比hive方便,直观 有两种方法,repartition, ...
- MPAndroid 的学习
1.MPAndroid 的github的地址: https://github.com/PhilJay/MPAndroidChart#documentation 2.使用步骤: 在build.gradl ...