1.zepto引入
正常引入即可
<script src=zepto.js></script>
<script>
document.write('<script src=' +
('__proto__' in {} ? 'zepto' : 'jquery') +
'.js><\/script>')
</script>注意：每一个引用类型的实例中，都有一个指针，指向其原型对象。这个指针在非IE浏览器里通过__proto__表示，而在IE里不提供。
2.zepto手动创建插件
格式：
;(function($){
$.extend($.fn,function(){
插件名称:function(){
插件方法
}
})
})(zepto)
extend通过源对象扩展目标对象的属性，源对象属性将覆盖目标对象属性。
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="../js/zepto.min.js"></script>
</head>
<body>
<section>
<p>name:lili</p>
<p>age:18</p>
<p>sex:girl</p>
</section>
</body>
<script type="text/javascript">
;(function($){
$.extend($.fn, {
foo: function(){
return this.html('bar') //改变元素里面的html为bar
}
})
})(Zepto)
$(function(){
$("p").eq(0).foo(); //第一个p元素的html内容变成bar
})()
</script>
</html>3.核心方法
（1）选择器 $（）
一般选择器选中出来的都是一个类数组对象
eg: $('div')就是选中页面中所有的div元素，是个类数组
何为类数组？
一般数组的叫做Array，1.里面的length会随着你增加，删除数组元素动态的发生改变。2.这样的一个数组可以使用专供数组使用的诸多方法，比如join(), pop(), push()等等方法；
而类数组就是一组类似数组的对象，他又length属性，你可以查看他的长度，但是你不能来动态的改变他里面的元素内容和值，比如上诉中$('div')就是个类素组，也可以说是获取了一个元素的集合（个人理解）
（2）方法（）
一些平时开发过程中不常用的方法，或者是一些常用方法但是发现了他的新内容，记录一下
1.$.grep()
获取一个新数组，新数组只包含回调函数中返回 ture 的数组项。
var array = [3,4,8,1,2,"你好"];
var s = $.grep(array,function(item){
return item >3
})
console.log(s) //返回【4,8】
2.$.inArray
返回数组中指定元素的索引值,三个参数$.inArray("查找的元素"，索引的数组，从哪个索引值向后查找)
$(function(){
var array = [3,4,8,1,2,"你好"];
console.log($.inArray(3, array));//0
console.log($.inArray("你好", array));//5
console.log($.inArray("你好", array,2));//5 从第二个索引开始向后查找
})
3.$.isFunction(object)/$.isPlainObject(object)/$.isWindow(object)
分别判断对象是否是个方法function；是否是一个纯的对象，通过对象常亮{}和object.create创建的对象；判断是否是一个window的对象；
返回的都是boolean值；
4.元素插入
after外部元素后插入，append内部元素后插入，before外部元素前插入，
5. .contents()和.children()
.contents()获得每个匹配元素集合元素的子元素，包括文字和注释节点。
.children()获得每个匹配元素集合元素的直接子元素
前者包括文本节点以及jQuery对象中产生的HTML元素
6.filter(), not()
filter() 方法将匹配元素集合缩减为匹配指定选择器的元素。
not() 从匹配元素集合中删除元素。
$('li').filter(':even').css('background-color', 'red'); //偶数的li元素设置背景是红色
$('li').not(':even').css('background-color', 'red'); //排除偶数的li其他的li设置红色背景
7.pluck
获取对象集合中每一个元素的属性值
console.log($("section").pluck('nodeName')) //返回["SECTION", "SECTION"]
8.unwrap wrap
移除集合中每个元素的直接父节点，并把他们的子元素保留在原来的位置。
$(document.body).append('<div id=wrapper><p>Content</p></div>')
$('#wrapper p').unwrap().parents() //=> [<body>, <html>]
$('.buttons a').wrap('<span>')
暂时就是这些吧，花了半天时间又过了一遍，温故而知新还是有帮助的
468
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
