如果你需要兼容ie瀏覽器，你可以用回jquery。
需要注意ie10以后不再支持條件注釋(為了提高與HTML5 的可互操作性和兼容性，Internet Explorer 10 標(biāo)準(zhǔn)模式和Quirks 模式中刪除了對(duì)條件注釋的支持)，因此，我們建議以下的document.write方法：
需要注意的是Zepto的一些可選功能是專(zhuān)門(mén)針對(duì)移動(dòng)端瀏覽器的；因?yàn)樗淖畛跄繕?biāo)在移動(dòng)端提供一個(gè)精簡(jiǎn)的類(lèi)似jquery的js庫(kù)。
核心方法
$()
$(selector, [context]) ? collection
$(<Zepto collection>) ? same collection
$(<DOM nodes>) ? collection
$(htmlString) ? collection
$(htmlString, attributes) ? collection v1.0+
Zepto(function($){ ... })
通過(guò)執(zhí)行css選擇器包裝dom節(jié)點(diǎn)，創(chuàng)建元素或者從一個(gè)html片段來(lái)創(chuàng)建一個(gè)Zepto對(duì)象。
Zepto集合是一個(gè)類(lèi)似數(shù)組的對(duì)象，它具有鏈?zhǔn)椒椒▉?lái)操作它指向的dom，除了$對(duì)象上的直接方法外(如$.extend)，文檔對(duì)象中的所有方法都是集合方法。
如果選擇器中存在content參數(shù)(css選擇器，dom，或者Zepto集合對(duì)象)，那么只在所給的節(jié)點(diǎn)背景下進(jìn)行css選擇器；這個(gè)功能有點(diǎn)像使用$(context).find(selector)。
可以通過(guò)一個(gè)html字符串片段來(lái)創(chuàng)建一個(gè)dom節(jié)點(diǎn)。也可以通過(guò)給定一組屬性映射來(lái)創(chuàng)建節(jié)點(diǎn)。最快的創(chuàng)建但元素，使用<div> 或 <div/>形式。
當(dāng)一個(gè)函數(shù)附加在 DOMContentLoaded 事件的處理流程中。如果頁(yè)面已經(jīng)加載完畢，這個(gè)方法將會(huì)立即被執(zhí)行。
$('div')
//=> all DIV elements on the page
$('#foo')
//=> element with ID "foo"
// create element:
$("<p>Hello</p>")
//=> the new P element
// create element with attributes:
$("<p />",
{
text:"Hello",
id:"greeting",
css:{color:'darkblue'}
})
//=> <p id=greeting style="color:darkblue">Hello</p>
// execute callback when the page is ready:
Zepto(function($){
alert('Ready to Zepto!')
})
不支持jQuery CSS 擴(kuò)展，但是可以選的“selector”模塊有限提供支持，如一些常用的偽選擇器，可以與現(xiàn)有的代碼或插件兼容執(zhí)行。
$.camelCase
v1.0+
$.camelCase(string) ? string
將一組字符串變成“駱駝”命名法的新字符串，如果該字符已經(jīng)是“駱駝”命名法，則不變化。
$.camelCase('hello-there')
//=> "helloThere"
$.camelCase('helloThere')
//=> "helloThere"
$.contains
v1.0+
$.contains(parent, node) ? boolean
檢查父節(jié)點(diǎn)是否包含給定的dom節(jié)點(diǎn)，如果兩者相同，則返回 false。
$.each
$.each(collection, function(index, item){ ... }) ? collection
遍歷數(shù)組元素或以key-value值對(duì)方式遍歷對(duì)象?；卣{(diào)函數(shù)返回 false 時(shí)停止遍歷。
$.each(['a',
'b',
'c'],
function(index,
item){
console.log('item %d is: %s',
index, item)
})
var hash = {
name:
'zepto.js',
size: 'micro'
}
$.each(hash,
function(key,
value){
console.log('%s: %s',
key, value)
})
$.extend
$.extend(target, [source, [source2, ...]]) ? target
$.extend(true, target, [source, ...]) ? target v1.0+
通過(guò)源對(duì)象擴(kuò)展目標(biāo)對(duì)象的屬性，源對(duì)象屬性將覆蓋目標(biāo)對(duì)象屬性。
默認(rèn)情況下為，復(fù)制為淺復(fù)制。如果第一個(gè)參數(shù)為true表示深度復(fù)制。
var target
= { one:
'patridge' },
source = {
two: 'turtle doves'
}
$.extend(target,
source)
//=> { one: 'patridge',
// two: 'turtle doves' }
$.fn
Zepto.fn是一個(gè)對(duì)象，它擁有Zepto對(duì)象上所有可用的方法。如 addClass()， attr()，和其它方法。在這個(gè)對(duì)象添加一個(gè)方法，所有的Zepto對(duì)象上都能用到該方法。
這里有一個(gè)實(shí)現(xiàn) empty() 方法的例子：
$.fn.empty
= function(){
return
this.each(function(){
this.innerHTML =
'' })
}
$.grep
v1.0+
$.grep(items, function(item){ ... }) ? array
$.grep([1,2,3],
function(){
return item > 1
});
//=>[2,3]
獲取一個(gè)新數(shù)組，新數(shù)組只包含回調(diào)函數(shù)中返回 ture 的數(shù)組項(xiàng)。
$.inArray
v1.0+
$.inArray(element, array, [fromIndex]) ? number
搜索數(shù)組中指定值并返回它的索引（如果沒(méi)有找到則返回-1）。
[fromIndex] 參數(shù)可選，表示從哪個(gè)索引值開(kāi)始向后查找。
$.inArray("abc",["bcd","abc","edf","aaa"]);
//=>1
$.inArray("abc",["bcd","abc","edf","aaa"],1);
//=>1
$.inArray("abc",["bcd","abc","edf","aaa"],2);
//=>-1
$.isArray
$.isArray(object) ? boolean
如果object是array，則返回ture。
$.isFunction
$.isFunction(object) ? boolean
如果object是function，則返回ture。
$.isPlainObject
v1.0+
$.isPlainObject(object) ? boolean
測(cè)試對(duì)象是否是純粹的對(duì)象（通過(guò) "{}" 或者 "new Object" 創(chuàng)建的），如果是，則返回true。
$.isPlainObject({})
// => true
$.isPlainObject(new
Object) // => true
$.isPlainObject(new
Date) // => false
$.isPlainObject(window)
// => false
$.isWindow
v1.0+
$.isWindow(object) ? boolean
確定參數(shù)是否為一個(gè)窗口（window對(duì)象），如果是則返回true。
這在處理iframe時(shí)非常有用，因?yàn)槊總€(gè)iframe都有它們自己的window對(duì)象，使用常規(guī)方法obj==window校驗(yàn)這些objects的時(shí)候會(huì)失敗。
$.map
$.map(collection, function(item, index){ ... }) ? collection
通過(guò)遍歷集合中的元素，通過(guò)函數(shù)返回一個(gè)新的數(shù)組，null and undefined 將被過(guò)濾掉。
$.map([1,2,3,4,5],function(item,index){
if(item>1){return item*item;}
});
// =>[4, 9, 16, 25]
$.map({"yao":1,"tai":2,"yang":3},function(item,index){
if(item>1){return item*item;}
});
// =>[4, 9]
$.parseJSON
v1.0+
$.parseJSON(string) ? object
類(lèi)似本地JSON.parse 方法，接受一個(gè)標(biāo)準(zhǔn)格式的 JSON 字符串，并返回解析后的 JavaScript 對(duì)象。
$.trim
v1.0+
$.trim(string) ? string
刪除字符串開(kāi)始和末尾的空白符。類(lèi)似String.prototype.trim()。
$.type
v1.0+
$.type(object) ? string
獲取JavaScript 對(duì)象的類(lèi)型?？赡艿念?lèi)型有： null undefined boolean number
string function array date regexp
object error。
對(duì)于其它對(duì)象，它只是簡(jiǎn)單報(bào)告為“object”，如果你想知道一個(gè)對(duì)象是否是一個(gè)javascript普通對(duì)象，使用 isPlainObject。
add
add(selector, [context]) ? self
添加元素到匹配的元素集合。如果content參數(shù)存在，只在content中進(jìn)行查找，否則在document中查找。
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
</ul>
<p>a paragraph</p>
<script type="text/javascript">
$('li').add('p').css('background-color', 'red');
</script>
addClass
addClass(name) ? self
addClass(function(index, oldClassName){ ... }) ? self
為每個(gè)匹配的元素添加指定的class類(lèi)名。多個(gè)class類(lèi)名通過(guò)空格分隔。
after
after(content) ? self
在每個(gè)匹配的元素后插入內(nèi)容。內(nèi)容可以為html字符串，dom節(jié)點(diǎn)，或者節(jié)點(diǎn)組成的數(shù)組。
$('form label').after('<p>A note below the label</p>')
append
append(content) ? self
在每個(gè)匹配的元素末尾插入內(nèi)容。內(nèi)容可以為html字符串，dom節(jié)點(diǎn)，或者節(jié)點(diǎn)組成的數(shù)組。
$('ul').append('<li>new list item</li>')
appendTo
appendTo(target) ? self
將匹配的元素插入到目標(biāo)元素的末尾（里面的后面）。這個(gè)有點(diǎn)像 append，但是插入的目標(biāo)與其相反。
$('<li>new list item</li>').appendTo('ul')
attr
attr(name) ? string
attr(name, value) ? self
attr(name, function(index, oldValue){ ... }) ? self
attr({ name: value, name2: value2, ... }) ? self
讀取或設(shè)置dom的屬性。如果沒(méi)有給定value參數(shù)，則讀取Zepto對(duì)象第集合一個(gè)元素的屬性值。當(dāng)給定了value參數(shù)。則設(shè)置Zepto對(duì)象集合中所有元素所有元素的屬性值。當(dāng)value參數(shù)為null，那么這個(gè)屬性將被移除(類(lèi)似removeAttr)，多個(gè)屬性能以通過(guò)對(duì)象值對(duì)的方式進(jìn)行設(shè)置。
要讀取dom的屬性如 checked和selected, 使用 prop。
var form =
$('form')
form.attr('action')
//=> read value
form.attr('action',
'/create') //=> set value
form.attr('action',
null) //=> remove attribute
// multiple attributes:
form.attr({
action:
'/create',
method: 'post'
})
before
before(content) ? self
在匹配每個(gè)元素的前面（外面）插入內(nèi)容。內(nèi)容可以為html字符串，dom節(jié)點(diǎn)，或者節(jié)點(diǎn)組成的數(shù)組。
$('table').before('<p>See the following table:</p>')
children
children([selector]) ? collection
獲得每個(gè)匹配元素集合元素的直接子元素，如果selector存在，只返回符合css選擇器的元素。
$('ol').children('*:nth-child(2n)')
//=> every other list item from every ordered list
clone
v1.0+
clone() ? collection
通過(guò)深度克隆來(lái)復(fù)制集合中的所有元素。
此方法不會(huì)有數(shù)據(jù)和事件處理程序復(fù)制到新的元素。這點(diǎn)和jquery中利用一個(gè)參數(shù)來(lái)確定是否復(fù)制數(shù)據(jù)和事件處理不相同。
closest
closest(selector, [context]) ? collection
closest(collection) ? collection v1.0+
closest(element) ? collection v1.0+
從元素本身開(kāi)始，逐級(jí)向上級(jí)元素匹配，并返回最先匹配selector的祖先元素。如果context節(jié)點(diǎn)參數(shù)存在。那么直考慮該節(jié)點(diǎn)的后代。這個(gè)方法與
parents(selector)有點(diǎn)相像，但他只返回最先匹配的祖先元素。
如果參數(shù)是一個(gè)Zepto對(duì)象集合或者一個(gè)元素，結(jié)果必須匹配給定的元素而不是選擇器。
var input =
$('input[type=text]')
input.closest('form')
concat
concat(nodes, [node2, ...]) ? self
添加元素到一個(gè)Zepto對(duì)象集合形成一個(gè)新數(shù)組。如果參數(shù)是一個(gè)數(shù)組，那么這個(gè)數(shù)組中的元素將會(huì)合并到Zepto對(duì)象集合中。
這是一個(gè)Zepto提供的方法，不是jquey的API 。
contents
v1.0+
contents() ? collection
獲得每個(gè)匹配元素集合元素的子元素，包括文字和注釋節(jié)點(diǎn)。.contents()和.children()方法類(lèi)似，只不過(guò)前者包括文本節(jié)點(diǎn)以及jQuery對(duì)象中產(chǎn)生的HTML元素。
css
css(property) ? value
css(property, value) ? self
css({ property: value, property2: value2, ... }) ? self
讀取或設(shè)置dom元素的css屬性。當(dāng)value參數(shù)不存在的時(shí)候，返回Zepto對(duì)象集合中第一個(gè)元素的css屬性。當(dāng)value參數(shù)存在時(shí)，設(shè)置Zepto對(duì)象集合中每一個(gè)元素的對(duì)應(yīng)css屬性。多條css屬性可以利用對(duì)象值對(duì)的方式進(jìn)行設(shè)置。
當(dāng)value為空(空字符串，null 或 undefined)，那個(gè)css屬性將會(huì)被移出。當(dāng)value參數(shù)為一個(gè)無(wú)單位的數(shù)字，如果該css屬性需要單位，“px”將會(huì)自動(dòng)添加到該屬性上。
var elem =
$('h1')
elem.css('background-color')
// read property
elem.css('background-color',
'#369') // set property
elem.css('background-color',
'') // remove property
// set multiple properties:
elem.css({
backgroundColor:
'#8EE',
fontSize: 28 })
data
data(name) ? value
data(name, value) ? self
讀取或?qū)懭雂om的 data-* 屬性。行為有點(diǎn)像 attr ，但是屬性名稱(chēng)前面加上
data-。
當(dāng)讀取屬性值時(shí)，會(huì)有下列轉(zhuǎn)換：v1.0+
each
each(function(index, item){ ... }) ? self
遍歷一個(gè)Zepto集合對(duì)象，為每一個(gè)匹配元素執(zhí)行一個(gè)函數(shù)。this關(guān)鍵字指向當(dāng)前item(作為函數(shù)的第二個(gè)參數(shù)傳遞)。如果函數(shù)返回 false，遍歷結(jié)束。
$('form input').each(function(index){
console.log('input %d is: %o',
index, this)
})
empty
empty() ? self
從Zepto對(duì)象集合中移除所有的dom子節(jié)點(diǎn)。
eq
eq(index) ? collection
從當(dāng)前Zepto對(duì)象集合中獲取給定索引號(hào)的元素。
$('li').eq(0)
//=> only the first list item
$('li').eq(-1)
//=> only the last list item
filter
filter(selector) ? collection
filter(function(index){ ... }) ? collection v1.0+
過(guò)濾Zepto集合對(duì)象，返回的Zepto集合對(duì)象里面的項(xiàng)滿(mǎn)足參數(shù)中的css選擇器。如果參數(shù)為一個(gè)函數(shù)，函數(shù)返回有實(shí)際值得時(shí)候，元素才會(huì)被返回。在函數(shù)中， this 關(guān)鍵字指向當(dāng)前的元素。
與此相反的功能，查看not.
find
find(selector) ? collection
find(collection) ? collection v1.0+
find(element) ? collection v1.0+
獲得當(dāng)前Zepto集合對(duì)象內(nèi)查找符合css選擇器的每個(gè)元素的后代。
如果參數(shù)為Zepto集合對(duì)象或者元素，過(guò)濾它們，只有當(dāng)它們?cè)诋?dāng)前Zepto集合對(duì)象中時(shí)，才回被返回。
var form =
$('#myform')
form.find('input, select')
first
first() ? collection
獲取當(dāng)前Zepto對(duì)象集合中的第一個(gè)元素。
forEach
forEach(function(item, index, array){ ... }, [context])
遍歷當(dāng)前Zepto集合對(duì)象的買(mǎi)個(gè)元素，有點(diǎn)類(lèi)似 each，但是遍歷函數(shù)的參數(shù)不一樣，當(dāng)函數(shù)返回 false 的時(shí)候，遍歷不會(huì)停止。
這是一個(gè)Zepto提供的方法，不是jquery的API。
get
get() ? array
get(index) ? DOM node
從當(dāng)前Zepto對(duì)象集合中獲取所有元素或單個(gè)元素。當(dāng)index參數(shù)不存在的時(shí)候，以普通數(shù)組的方式返回所有的元素。當(dāng)指定index時(shí)，只返回該置的元素。這點(diǎn)與與eq不同，該方法返回的不是Zepto集合對(duì)象。
var elements =
$('h2')
elements.get()
//=> get all headings as an array
elements.get(0)
//=> get first heading node
has
v1.0+
has(selector) ? collection
has(node) ? collection
判斷當(dāng)前Zepto對(duì)象集合的子元素是否有符合選擇器的元素，或者是否包含指定的dom節(jié)點(diǎn)，如果有，則返回新的Zepto集合對(duì)象，該對(duì)象過(guò)濾掉不含有選擇器匹配元素或者不含有指定dom節(jié)點(diǎn)的對(duì)象。
$('ol > li').has('a[href]')
//=> get only LI elements that contain links
hasClass
hasClass(name) ? boolean
檢查Zepto對(duì)象集合中是否有元素含有指定的class。
<ul>
<li>list item 1</li>
<li class="yaotaiyang">list item 2</li>
<li>list item 3</li>
</ul>
<p>a paragraph</p>
<script type="text/javascript">
$("li").hasClass("yaotaiyang");
//=> true
</script>
height
height() ? number
height(value) ? self
height(function(index, oldHeight){ ... }) ? self
獲取Zepto對(duì)象集合中第一個(gè)元素的高度；或者設(shè)置Zepto對(duì)象集合中所有元素的高度。
$('#foo').height()
// => 123
$(window).height()
// => 838 (viewport height)
$(document).height()
// => 22302
hide
hide() ? self
通過(guò)設(shè)置css的屬性display 為 none來(lái)將Zepto對(duì)象集合中的元素隱藏。
Hide elements in this collection by setting their display CSS property to
none.
html
html() ? string
html(content) ? self
html(function(index, oldHtml){ ... }) ? self
獲取或設(shè)置Zepto對(duì)象集合中元素的HTML內(nèi)容。當(dāng)content參數(shù)沒(méi)有給定時(shí)，返回IZepto對(duì)象集合中第一個(gè)元素的innerHtm。當(dāng)content參數(shù)給定時(shí)。用其替換Zepto對(duì)象集合中每個(gè)元素的content。content可以是append中描述的所有類(lèi)型。
// autolink everything that looks like a Twitter username
$('.comment p').html(function(idx,
oldHtml){
return
oldHtml.replace(/(^|\W)@(\w{1,15})/g,
'$1@<a )
})
index
index([element]) ? number
獲取一個(gè)元素的位置。當(dāng)elemen參數(shù)沒(méi)有給出時(shí)，返回當(dāng)前元素在兄弟節(jié)點(diǎn)中的位置。當(dāng)element參數(shù)給出時(shí)，返回它在當(dāng)前Zepto對(duì)象集合中的位置。如果沒(méi)有該元素，則返回-1。
$('li:nth-child(2)').index()
//=> 1
indexOf
indexOf(element, [fromIndex]) ? number
在當(dāng)前Zepto中獲取一個(gè)元素的位置。如果formindex參數(shù)給出，從該位置往后查找，返回基于0的位置，如果沒(méi)找到，則返回-1。index 方法是基于這個(gè)方法實(shí)現(xiàn)的。
這是一個(gè)Zepto的方法，不是jquer的api。
insertAfter
insertAfter(target) ? self
插入Zepto對(duì)象集合中的元素到指定的每個(gè)元素后面的dom中。這個(gè)有點(diǎn)像 after，但是使用方式相反。
$('<p>Emphasis mine.</p>').insertAfter('blockquote')
insertBefore
insertBefore(target) ? self
插入Zepto對(duì)象集合中的元素到指定的每個(gè)元素前面的dom中。這個(gè)有點(diǎn)像 before，但是使用方式相反。
$('<p>See the following table:</p>').insertBefore('table')
is
is(selector) ? boolean
判斷當(dāng)前Zepto元素集合中的第一個(gè)元素是否符css選擇器。對(duì)于基礎(chǔ)支持jquery的非標(biāo)準(zhǔn)選擇器類(lèi)似： :visible包含在可選的“selector”模塊中。
jQuery
CSS extensions 不被支持。 選擇“selector”模塊僅僅能支持有限幾個(gè)最常用的方式。
last
last() ? collection
獲取Zepto集合對(duì)象中最后一個(gè)元素。
map
map(function(index, item){ ... }) ? collection
遍歷Zepto對(duì)象集合中的所有元素。通過(guò)遍歷函數(shù)返回值形成一個(gè)新的集合對(duì)象。在遍歷函數(shù)中this關(guān)鍵之指向當(dāng)前循環(huán)的item（遍歷函數(shù)中的第二個(gè)參數(shù)）。遍歷中返回 null和undefined，遍歷將被打斷。
// get text contents of all elements in collection
elements.map(function(){
return
$(this).text()
}).get().join(', ')
next
next() ? collection
next(selector) ? collection v1.0+
獲取Zepto對(duì)象集合中每一個(gè)元素的下一個(gè)兄弟節(jié)點(diǎn)(可以選擇性的帶上過(guò)濾選擇器)。
$('dl dt').next()
//=> the DD elements
not
not(selector) ? collection
not(collection) ? collection
not(function(index){ ... }) ? collection
過(guò)濾當(dāng)前Zepto對(duì)象集合，獲取一個(gè)新的Zepto對(duì)象集合，它里面的元素不能匹配css選擇器。如果另一個(gè)參數(shù)為Zepto集合對(duì)象，那么返回的新Zepto對(duì)象中的元素都不包含在該參數(shù)對(duì)象中。如果參數(shù)是一個(gè)函數(shù)。僅僅包含函數(shù)執(zhí)行為false值得時(shí)候的元素，函數(shù)的
this 關(guān)鍵字指向當(dāng)前循環(huán)元素。
與它相反的功能，查看 filter.
offset
offset() ? object
offset(coordinates) ? self v1.0+
offset(function(index, oldOffset){ ... }) ? self v1.0+
獲得當(dāng)前元素相對(duì)于document的位置。返回一個(gè)對(duì)象含有：
top, left, width和height
當(dāng)給定一個(gè)對(duì)象屬性left和top使用這些值來(lái)相對(duì)于document對(duì)每一個(gè)元素進(jìn)行定位。
offsetParent
v1.0+
offsetParent() ? collection
找到第一個(gè)定位過(guò)的祖先元素，在ccs中意味著它的position 值為“relative”, “absolute” or “fixed”
parent
parent([selector]) ? collection
獲取Zepto對(duì)象集合中每個(gè)元素的直接父元素。如果css選擇器參數(shù)給出。過(guò)濾出符合條件的元素。
parents
parents([selector]) ? collection
獲取Zepto對(duì)象集合每個(gè)元素所有的祖先元素。如果css選擇器參數(shù)給出，過(guò)濾出符合條件的元素。
如果想獲取直接父級(jí)元素，使用 parent。如果只想獲取到第一個(gè)符合css選擇器的元素，使用closest。
$('h1').parents()
//=> [<div#container>, <body>, <html>]
pluck
pluck(property) ? array
獲取Zepto對(duì)象集合中每一個(gè)元素的屬性值。返回值為 null或undefined值得過(guò)濾掉。
$('body > *').pluck('nodeName')
// => ["DIV", "SCRIPT"]
// implementation of Zepto's `next` method
$.fn.next
= function(){
return
$(this.pluck('nextElementSibling'))
}
這是一個(gè)Zepto的方法，不是jquery的api
position
v1.0+
position() ? object
獲取Zepto對(duì)象集合中第一個(gè)元素的位置。相對(duì)于
offsetParent。當(dāng)絕對(duì)定位的一個(gè)素靠近另一個(gè)元素的時(shí)候，這個(gè)方法是有用的。
返回一個(gè)的對(duì)象有這些屬性：top, left。
var pos =
element.position()
// position a tooltip relative to the element
$('#tooltip').css({
position:
'absolute',
top:
pos.top -
30,
left:
pos.left
})
prepend
prepend(content) ? self
將參數(shù)內(nèi)容插入到每個(gè)匹配元素的前面（元素內(nèi)部）。插入d的元素可以試html字符串片段，一個(gè)dom節(jié)點(diǎn)，或者一個(gè)節(jié)點(diǎn)的數(shù)組。
$('ul').prepend('<li>first list item</li>')
prependTo
prependTo(target) ? self
將所有元素插入到目標(biāo)前面（元素內(nèi)）。這有點(diǎn)像prepend，但是是相反的方式。
$('<li>first list item</li>').prependTo('ul')
prev
prev() ? collection
prev(selector) ? collection v1.0+
獲取Zepto對(duì)象集合中每一個(gè)元素的前一個(gè)兄弟節(jié)點(diǎn)，通過(guò)選擇器來(lái)進(jìn)行過(guò)濾。
prop
v1.0+
prop(name) ? value
prop(name, value) ? self
prop(name, function(index, oldValue){ ... }) ? self
讀取或設(shè)置dom元素的屬性值。它在讀取屬性值的情況下優(yōu)先于 attr，因?yàn)檫@些屬性值會(huì)因?yàn)橛脩?hù)的交互發(fā)生改變，如checked and
selected。
<input class="taiyang" id="check1" type="checkbox" checked="checked">
<input class="yaotaiyang" id="check2" type="checkbox">
<script type="text/javascript">
$("#check1").attr("checked"); //=> "checked"
$("#check1").prop("checked"); //=> "true"
$("#check2").attr("checked"); //=> "false"
$("#check2").prop("checked"); //=> "false"
$("input[type='checkbox']").prop("type",function(index,oldvalue){
console.log(index+"|"+oldvalue);
});
//=> 0|checkbox
//=> 1|checkbox
$("input[type='checkbox']").prop("className",function(index,oldvalue){
console.log(index+"|"+oldvalue);
});
//=> 0|taiyang
//=> 1|yaotaiyang
</script>
push
push(element, [element2, ...]) ? self
添加元素到當(dāng)前Zepto對(duì)象的最后。
這是一個(gè)zepto的方法，不是jquery的api
ready
ready(function($){ ... }) ? self
添加一個(gè)事件偵聽(tīng)器，當(dāng)頁(yè)面dom加載完畢 “DOMContentLoaded” 事件觸發(fā)時(shí)觸發(fā)。建議使用 $()來(lái)代替這種用法。
reduce
reduce(function(memo, item, index, array){ ... }, [initial]) ? value
與 Array.reduce有相同的用法，遍歷當(dāng)前Zepto對(duì)象集合。memo是函數(shù)上次的返回值。迭代進(jìn)行遍歷。
這是一個(gè)zepto的方法，不是jquery的api
remove
remove() ? self
移出當(dāng)前Zepto對(duì)象中的元素。有效的從dom中移除。
removeAttr
removeAttr(name) ? self
移動(dòng)當(dāng)前Zepto對(duì)象集合中所有元素的指定屬性。
removeClass
removeClass([name]) ? self
removeClass(function(index, oldClassName){ ... }) ? self
移動(dòng)當(dāng)前Zepto對(duì)象集合中所有元素的指定class。如果name參數(shù)未給出。將移出所有的class。多個(gè)class參數(shù)名稱(chēng)可以利用空格分隔。下例移除了兩個(gè)class。
<input class="taiyang yueliang" id="check1" type="checkbox" checked="checked">
<input class="yaotaiyang" id="check2" type="checkbox">
<script type="text/javascript">
$("#check1").removeClass("taiyang yueliang")
//=>[<input class id="check1" type="checkbox" checked="checked">]
replaceWith
replaceWith(content) ? self
用提供的內(nèi)容替換所有匹配的元素。(包含元素本身)。content參數(shù)可以為
before中描述的類(lèi)型。
scrollTop
v1.0+
scrollTop() ? number
獲取頁(yè)面上的滾動(dòng)元素或者整個(gè)窗口已經(jīng)滾動(dòng)的像素值。
show
show() ? self
恢復(fù)Zepto對(duì)象集合中每個(gè)元素默認(rèn)的“display”值。如果你用 hide將元素隱藏，用該屬性可以將其顯示。相當(dāng)于干掉了display：none。
siblings
siblings([selector]) ? collection
獲取Zepto集合對(duì)象所有兄弟節(jié)點(diǎn)。如果css選擇器參數(shù)給出。過(guò)濾出符合選擇器的元素。
size
size() ? number
獲取Zepto對(duì)象集合中元素的數(shù)量。
slice
slice(start, [end]) ? array
array中提取的方法。從start開(kāi)始，如果end 指出。提取不包含end位置的元素。
text
text() ? string
text(content) ? self
獲取或者設(shè)置所有Zepto對(duì)象的文本內(nèi)容。當(dāng)content參數(shù)未給出。返回當(dāng)前Zepto對(duì)象集合中第一個(gè)元素的文本內(nèi)容（包含子節(jié)點(diǎn)中的文本內(nèi)容）。當(dāng)content參數(shù)給出，使用它替換Zepto對(duì)象集合中所有元素的文本內(nèi)容。它有待點(diǎn)似
html，與它不同的是它不能用來(lái)獲取或設(shè)置 HTML。
toggle
toggle([setting]) ? self
顯示或隱藏匹配元素。如果 setting為true，相當(dāng)于show 法。如果setting為false。相當(dāng)于
hide方法。
var input =
$('input[type=text]')
$('#too_long').toggle(input.val().length
> 140)
toggleClass
toggleClass(names, [setting]) ? self
toggleClass(function(index, oldClassNames){ ... }, [setting]) ? self
在匹配的元素集合中的每個(gè)元素上添加或刪除一個(gè)或多個(gè)樣式類(lèi)。如果class的名稱(chēng)存在則刪除它，如果不存在，就添加它。如果 setting的值為真，這個(gè)功能類(lèi)似于
addClass，如果為假，這個(gè)功能類(lèi)似與 removeClass。
unwrap
unwrap() ? self
將匹配元素的父級(jí)元素刪除，保留自身（和兄弟元素，如果存在）在原來(lái)的位置。
$(document.body).append('<div id=wrapper><p>Content</p></div>')
$('#wrapper p').unwrap().parents()
//=> [<body>, <html>]
val
val() ? string
val(value) ? self
val(function(index, oldValue){ ... }) ? self
獲取或設(shè)置匹配元素的值。當(dāng)value參數(shù)不存在。返回第一個(gè)元素的值。如果是<select multiple>標(biāo)簽，則返回一個(gè)數(shù)組。
width
width() ? number
width(value) ? self
width(function(index, oldWidth){ ... }) ? self
獲取Zepto對(duì)象集合中第一個(gè)元素的寬；或者設(shè)置Zepto對(duì)象集合所有元素的寬。
$('#foo').width()
// => 123
$(window).width()
// => 768 (viewport width)
$(document).width()
// => 768
wrap
wrap(structure) ? self
wrap(function(index){ ... }) ? self v1.0+
在每個(gè)匹配的元素外層包上一個(gè)html元素。structure參數(shù)可以是一個(gè)單獨(dú)的元素或者一些嵌套的元素。也可以是一個(gè)html字符串片段或者dom節(jié)點(diǎn)。還可以是一個(gè)生成用來(lái)包元素的回調(diào)函數(shù)，這個(gè)函數(shù)返回前兩種類(lèi)型的包裹片段。
需要提醒的是：該方法對(duì)于dom中的節(jié)點(diǎn)有著很好的支持。如果將wrap() 用在一個(gè)新的元素上，然后再將結(jié)果插入到document中，此時(shí)該方法無(wú)效。
// wrap each button in a separate span:
$('.buttons a').wrap('<span>')
// wrap each code block in a div and pre:
$('code').wrap('<div class=highlight><pre /></div>')
// wrap all form inputs in a span with classname
// corresponding to input type:
$('input').wrap(function(index){
return '<span class=' +
this.type +
'field />'
})
//=> <span class=textfield><input type=text /></span>,
// <span class=searchfield><input type=search /></span>
// WARNING: will not work as expected!
$('<em>broken</em>').wrap('<li>').appendTo(document.body)
// do this instead:
$('<em>better</em>').appendTo(document.body).wrap('<li>')
wrapAll
wrapAll(structure) ? self
在所有匹配元素外面包一層HTML結(jié)構(gòu)。
// wrap all buttons in a single div:
$('a.button').wrap('<div id=buttons />')
wrapInner
wrapInner(structure) ? self
wrapInner(function(index){ ... }) ? self v1.0+
在匹配元素里的內(nèi)容外包一層結(jié)構(gòu)。
// wrap the contents of each navigation link in a span:
$('nav a').wrapInner('<span>')
// wrap the contents of each list item in a paragraph and emphasis:
$('ol li').wrapInner('<p><em /></p>')
以下為原始html：
<div class="yaotaiyang">
<div class="taiyang">yao</div>
<div class="taiyang">yao</div>
</div>
通過(guò)：$('.taiyang).wrapInner('<div class="new" />');
得到：
<div class="yaotaiyang">
<div class="taiyang"><div class="new">yao</div></div>
<div class="taiyang"><div class="new">yao</div></div>
</div>
檢測(cè)方法
Detect module
該檢測(cè)方法可以在不同的環(huán)境中微調(diào)你的站點(diǎn)或者應(yīng)用程序，并幫助你識(shí)別手機(jī)和平板；以及不同的瀏覽器和操作系統(tǒng)。
// The following boolean flags are set to true if they apply,
// if not they're either set to `false` or `undefined`.
// We recommend accessing them with `!!` prefixed to coerce to a boolean.
// general device type
$.os.phone
$.os.tablet
// specific OS
$.os.ios
$.os.android
$.os.webos
$.os.blackberry
$.os.bb10
$.os.rimtabletos
// specific device type
$.os.iphone
$.os.ipad
$.os.touchpad
$.os.kindle
// specific browser
$.browser.chrome
$.browser.firefox
$.browser.silk
$.browser.playbook
// Additionally, version information is available as well.
// Here's what's returned for an iPhone running iOS 6.1.
!!$.os.phone
// => true
!!$.os.iphone
// => true
!!$.os.ios
// => true
!!$.os.version
// => "6.1"
!!$.browser.version
// => "536.26"
事件處理
$.Event
$.Event(type, [properties]) ? event
創(chuàng)建并初始化一個(gè)指定的dom事件。如果properties參數(shù)給出，使用它來(lái)擴(kuò)展出新的事件對(duì)象。默認(rèn)情況下，事件被設(shè)置為冒泡方式；這個(gè)可以通過(guò)設(shè)置bubbles為false來(lái)關(guān)閉。
初始化的功能可以使用
trigger來(lái)觸發(fā)。
$.Event('mylib:change',
{ bubbles: false
});
$.proxy
v1.0+
$.proxy(fn, context) ? function
$.proxy(context, property) ? function
接受一個(gè)函數(shù)，然后返回一個(gè)新函數(shù)，并且這個(gè)新函數(shù)始終保持了特定的上下文語(yǔ)境，新函數(shù)中this指向context參數(shù)。另外一種形式，原始的function是context對(duì)像的方法。
var obj =
{name:
'Zepto'},
handler =
function(){
console.log("hello from + ",
this.name)
}
// ensures that the handler will be executed in the context of `obj`:
$(document).on('click',
$.proxy(handler,
obj));
var obj = {name: "yaotaiyang",
test: function() {
alert( this.name );
$("#test").unbind("click", obj.test);
}
};
$("#test").click( jQuery.proxy( obj, "test" ));
bind
????
Deprecated, use on instead.
bind(type, function(e){ ... }) ? self
bind({ type: handler, type2: handler2, ... }) ? self
為一個(gè)元素綁定一個(gè)處理事件。
delegate
????
Deprecated, use on instead.
delegate(selector, type, function(e){ ... }) ? self
delegate(selector, { type: handler, type2: handler2, ... }) ? self
基于一組特定的根元素為所有選擇器匹配的元素附加一個(gè)處理事件，匹配的元素可能現(xiàn)在或?qū)?lái)才創(chuàng)建。
die
????
Deprecated, use off instead.
die(type, function(e){ ... }) ? self
die({ type: handler, type2: handler2, ... }) ? self
刪除通過(guò) live 添加的事件。
live
????
Deprecated, use on instead.
live(type, function(e){ ... }) ? self
live({ type: handler, type2: handler2, ... }) ? self
類(lèi)似delegate，添加一個(gè)個(gè)事件處理器到符合目前選擇器的所有元素匹配，匹配的元素可能現(xiàn)在或?qū)?lái)才創(chuàng)建。
off
off(type, [selector], function(e){ ... }) ? self
off({ type: handler, type2: handler2, ... }, [selector]) ? self
off(type, [selector]) ? self
off() ? self
移除通過(guò) on 注冊(cè)的事件(用bind或者用on注冊(cè)的事件)。如果沒(méi)有參數(shù)，將移出當(dāng)前元素上所有的注冊(cè)事件。
off(type, [selector], function(e){ ... }) ? self
如果selector存在，則相當(dāng)于delegate。
$("ul").on("click","li",function(){alert("yaotaiyang")});
以上代碼相當(dāng)于將li的事件代理到ul上。后續(xù)添加的li也能擁有以上方法。該事件可以通過(guò)undelegate來(lái)移除。
$("ul").undelegate()；
也可用:$("ul").off();
如果selector參數(shù)不存在。則相當(dāng)于bind。
$("li").on("click",function(){alert("yaotaiyang")});
該事件可以通過(guò)unbind來(lái)移除。
$("li").unbind("click");
也可以用off()來(lái)移除:$("li").off();
on方法繼集成bind和delegate方法。
on
on(type, [selector], function(e){ ... }) ? self
on({ type: handler, type2: handler2, ... }, [selector]) ? self
添加事件到Zepto對(duì)象集合上。多個(gè)事件可以通過(guò)空格的字符串方式添加?；蛘咭允录?lèi)型、函數(shù)對(duì)象的 方式。如果css選擇器給出，事件的對(duì)象滿(mǎn)足選擇器條件時(shí)。事件才會(huì)被觸發(fā)。
事件處理程序在觸發(fā)事件元素或者css選擇器匹配的元素的上下文中執(zhí)行(this指向觸發(fā)事件的元素)。
當(dāng)事件處理程序返回false, 或調(diào)用preventDefault()，瀏覽器的默認(rèn)事件將會(huì)被阻止。
var elem =
$('#content')
// observe all clicks inside #content:
elem.on('click',
function(e){
... })
// observe clicks inside navigation links in #content
elem.on('click',
'nav a',
function(e){
... })
// all clicks inside links in the document
$(document).on('click',
'a',
function(e){
... })
on(type, [selector], function(e){ ... }) ? self
如果selector存在，則相當(dāng)于delegate。
$("ul").on("click","li",function(){alert("yaotaiyang")});
以上代碼相當(dāng)于將li的事件代理到ul上。后續(xù)添加的li也能擁有以上方法。該事件可以通過(guò)undelegate來(lái)移除。
$("ul").undelegate()；
也可用:$("ul").off();
如果selector參數(shù)不存在。則相當(dāng)于bind。
$("li").on("click",function(){alert("yaotaiyang")});
該事件可以通過(guò)unbind來(lái)移除。
$("li").unbind("click");
也可以用off()來(lái)移除:$("li").off();
on方法繼集成bind和delegate方法。
one
one(type, function(e){ ... }) ? self
one({ type: handler, type2: handler2, ... }) ? self
添加一個(gè)處理事件到元素。處理函數(shù)在每個(gè)元素上最多執(zhí)行一次。
trigger
trigger(event, [data])
在Zepto對(duì)象集合的元素上觸發(fā)指定的事件。事件可以是一個(gè)字符串，也可以是一個(gè) $.Event 對(duì)象。如果data參數(shù)存在，它會(huì)作為參數(shù)傳遞給事件函數(shù)。
// add a handler for a custom event
$(document).on('mylib:change',
function(e,
from, to){
console.log('change on %o with data %s, %s',
e.target,
from, to)
})
// trigger the custom event
$(document.body).trigger('mylib:change',
['one',
'two'])
Zepto僅僅支持在dom元素上觸發(fā)事件。
triggerHandler
triggerHandler(event, [data]) ? self
像 trigger，它只觸發(fā)事件，但不冒泡。
比如你再一個(gè)input上如果使用該方法。
$("input").triggerHandler('focus');
// 此時(shí)input上的focus事件觸發(fā)，但是input不會(huì)聚焦
$("input").trigger('focus');
// 此時(shí)input上的focus事件觸發(fā)，input聚焦
unbind
????
Deprecated, use off instead.
unbind(type, function(e){ ... }) ? self
unbind({ type: handler, type2: handler2, ... }) ? self
移除通過(guò) bind 注冊(cè)的事件。
undelegate
????
Deprecated, use off instead.
undelegate(selector, type, function(e){ ... }) ? self
undelegate(selector, { type: handler, type2: handler2, ... }) ? self
移除通過(guò)delegate 注冊(cè)的事件。
Ajax請(qǐng)求
$.ajax
$.ajax(options) ? XMLHttpRequest
執(zhí)行Ajax請(qǐng)求。請(qǐng)求地址可以是本地的或者跨域的，在支持的瀏覽器中通過(guò)
HTTP access control或者通過(guò)
JSONP來(lái)完成。
參數(shù):
type (默認(rèn)： “GET”)：請(qǐng)求方法 (“GET”, “POST”, or other)url (默認(rèn)： 當(dāng)前地址)：發(fā)送請(qǐng)求的地址data (默認(rèn)：none)：發(fā)送到服務(wù)器的數(shù)據(jù)；如果是get請(qǐng)求，它會(huì)自動(dòng)被作為參數(shù)拼接到url上。非String對(duì)象將通過(guò)
$.param 得到序列化字符串。
processData (默認(rèn)： true)： 對(duì)于非Get請(qǐng)求。是否自動(dòng)將 data 轉(zhuǎn)換為字符串。-
contentType (默認(rèn)： “application/x-www-form-urlencoded”)： 發(fā)送信息至服務(wù)器時(shí)內(nèi)容編碼類(lèi)型。 (這也可以通過(guò)設(shè)置headers
headers)。通過(guò)設(shè)置 false 跳過(guò)設(shè)置默認(rèn)值。
-
dataType (默認(rèn)： none)：預(yù)期服務(wù)器返回的數(shù)據(jù)類(lèi)型(“json”, “jsonp”, “xml”, “html”, or “text”)
timeout (默認(rèn)： 0)： 設(shè)置請(qǐng)求超時(shí)時(shí)間（毫秒），0表示不超時(shí)。headers (默認(rèn)：{})： 一個(gè)額外的"{鍵:值}"對(duì)映射到請(qǐng)求一起發(fā)送async (默認(rèn)： true)：默認(rèn)設(shè)置下，所有請(qǐng)求均為異步。如果需發(fā)送同步請(qǐng)求，請(qǐng)將此設(shè)置為 false。global (默認(rèn)： true)：請(qǐng)求將觸發(fā)全局AJAX事件處理程序，設(shè)置為 false 將不會(huì)觸發(fā)全局 AJAX 事件。context (默認(rèn)： window)： 這個(gè)對(duì)象用于設(shè)置Ajax相關(guān)回調(diào)函數(shù)的上下文(this指向)。traditional (默認(rèn)：false)：激活傳統(tǒng)的方式通過(guò)$.param來(lái)得到序列化的 data。
如果URL中含有 =?或者dataType是“jsonp”，這講求將會(huì)通過(guò)注入一個(gè)
<script>標(biāo)簽來(lái)代替使用 XMLHttpRequest (查看 JSONP)。此時(shí)對(duì)
contentType, dataType, headers有限制，async 不被支持。
Ajax 回調(diào)函數(shù)
你可以指定以下的回調(diào)函數(shù)，給出的執(zhí)行順序：
-
beforeSend(xhr, settings)：請(qǐng)求發(fā)出前調(diào)用，它接收xhr對(duì)象和settings作為參數(shù)對(duì)象。如果它返回 false ，請(qǐng)求將被取消。
-
success(data, status, xhr)：請(qǐng)求成功之后調(diào)用。傳入返回后的數(shù)據(jù)，以及包含成功代碼的字符串。
-
error(xhr, errorType, error)：請(qǐng)求出錯(cuò)時(shí)調(diào)用。 (超時(shí)，解析錯(cuò)誤，或者狀態(tài)碼不在HTTP 2xx)。
-
complete(xhr, status)：請(qǐng)求完成時(shí)調(diào)用，無(wú)論請(qǐng)求失敗或成功。
Ajax 事件
當(dāng)global: true時(shí)。在Ajax請(qǐng)求生命周期內(nèi)，以下這些事件將被觸發(fā)。
-
ajaxStart (global)：如果沒(méi)有其他Ajax請(qǐng)求當(dāng)前活躍將會(huì)被觸發(fā)。
-
ajaxBeforeSend (data: xhr, options)：再發(fā)送請(qǐng)求前，可以被取消。
-
ajaxSend (data: xhr, options)：像 ajaxBeforeSend，但不能取消。
-
ajaxSuccess (data: xhr, options, data)：當(dāng)返回成功時(shí)。
-
ajaxError (data: xhr, options, error)：當(dāng)有錯(cuò)誤時(shí)。
-
ajaxComplete (data: xhr, options)：請(qǐng)求已經(jīng)完成后，無(wú)論請(qǐng)求是成功或者失敗。
-
ajaxStop (global)：如果這是最后一個(gè)活躍著的Ajax請(qǐng)求，將會(huì)被觸發(fā)。
默認(rèn)情況下，Ajax事件在document對(duì)象上觸發(fā)。然而，如果請(qǐng)求的
context 是一個(gè)dom節(jié)點(diǎn)，該事件會(huì)在此節(jié)點(diǎn)上觸發(fā)然后再dom中冒泡。唯一的例外是 ajaxStart & ajaxStop這兩個(gè)全局事件。
$(document).on('ajaxBeforeSend',
function(e,
xhr, options){
// This gets fired for every Ajax request performed on the page.
// The xhr object and $.ajax() options are available for editing.
// Return false to cancel this request.
})
$.ajax({
type:
'GET',
url:
'/projects',
// data to be added to query string:
data: {
name: 'Zepto.js'
},
// type of data we are expecting in return:
dataType:
'json',
timeout: 300,
context:
$('body'),
success: function(data){
// Supposing this JSON payload was received:
// {"project": {"id": 42, "html": "<div>..." }}
// append the HTML to context object.
this.append(data.project.html)
},
error:
function(xhr,
type){
alert('Ajax error!')
}
})
// post a JSON payload:
$.ajax({
type:
'POST',
url:
'/projects',
// post payload:
data:
JSON.stringify({
name: 'Zepto.js'
}),
contentType: 'application/json'
})
$.ajaxJSONP
????
Deprecated, use $.ajax instead.
$.ajaxJSONP(options) ? mock XMLHttpRequest
執(zhí)行JSONP跨域獲取數(shù)據(jù)。
此方法相對(duì) $.ajax 沒(méi)有優(yōu)勢(shì)，建議不要使用。
$.ajaxSettings
一個(gè)包含Ajax請(qǐng)求的默認(rèn)設(shè)置的對(duì)象。大部分的設(shè)置在 $.ajax中已經(jīng)描述。以下設(shè)置為全局非常有用：
Object containing the default settings for Ajax requests. Most settings are
described in $.ajax. The ones that are useful when set globally are:
timeout (默認(rèn)： 0)：對(duì)Ajax請(qǐng)求設(shè)置一個(gè)非零的值指定一個(gè)默認(rèn)的超時(shí)時(shí)間，以毫秒為單位。global (默認(rèn)： true)：設(shè)置為false。以防止觸發(fā)Ajax事件。xhr (默認(rèn)：XMLHttpRequest factory)：設(shè)置為一個(gè)函數(shù)，它返回XMLHttpRequest實(shí)例(或一個(gè)兼容的對(duì)象)accepts: 從服務(wù)器請(qǐng)求的MIME類(lèi)型，指定dataType值：
- script: “text/javascript, application/javascript”
- json: “application/json”
- xml: “application/xml, text/xml”
- html: “text/html”
- text: “text/plain”
$.get
$.get(url, function(data, status, xhr){ ... }) ? XMLHttpRequest
$.get(url, [data], [function(data, status, xhr){ ... }], [dataType]) ? XMLHttpRequest v1.0+
執(zhí)行一個(gè)Ajax GET請(qǐng)求。這是一個(gè) $.ajax的簡(jiǎn)寫(xiě)方式。
$.get('/whatevs.html',
function(response){
$(document.body).append(response)
})
$.getJSON
$.getJSON(url, function(data, status, xhr){ ... }) ? XMLHttpRequest
$.getJSON(url, [data], function(data, status, xhr){ ... }) ? XMLHttpRequest v1.0+
通過(guò) Ajax GET請(qǐng)求獲取JSON數(shù)據(jù)。這是一個(gè) $.ajax 的簡(jiǎn)寫(xiě)方式。
$.getJSON('/awesome.json',
function(data){
console.log(data)
})
// fetch data from another domain with JSONP
$.getJSON('//example.com/awesome.json?callback=?',
function(remoteData){
console.log(remoteData)
})
$.param
$.param(object, [shallow]) ? string
$.param(array) ? string
創(chuàng)建一個(gè)序列化的數(shù)組或?qū)ο螅m用于一個(gè)URL 地址查詢(xún)字符串或Ajax請(qǐng)求。如果shallow設(shè)置為true。嵌套對(duì)象不會(huì)被序列化，嵌套數(shù)組的值不會(huì)使用放括號(hào)在他們的key上。
此外，還接受 serializeArray格式的數(shù)組，其中每個(gè)項(xiàng)都有 “name” 和 “value”屬性。
Also accepts an array in serializeArray format, where each
item has “name” and “value” properties.
$.param({
foo: {
one: 1,
two: 2 }})
//=> "foo[one]=1&foo[two]=2)"
$.param({
ids:
[1,2,3]
})
//=> "ids[]=1&ids[]=2&ids[]=3"
$.param({
ids:
[1,2,3]
}, true)
//=> "ids=1&ids=2&ids=3"
$.param({
foo:
'bar',
nested: {
will: 'not be ignored'
}})
//=> "foo=bar&nested[will]=not+be+ignored"
$.param({
foo:
'bar',
nested: {
will: 'be ignored'
}}, true)
//=> "foo=bar&nested=[object+Object]"
$.post
$.post(url, [data], function(data, status, xhr){ ... }, [dataType]) ? XMLHttpRequest
執(zhí)行Ajax POST請(qǐng)求。這是一個(gè) $.ajax 的簡(jiǎn)寫(xiě)方式。
$.post('/create',
{ sample:
'payload' },
function(response){
// process response
})
data 參數(shù)可以是一個(gè)字符串：
$.post('/create',
$('#some_form').serialize(),
function(response){
// ...
})
load
load(url, function(data, status, xhr){ ... }) ? self
通過(guò)GET Ajax載入遠(yuǎn)程 HTML 文件代碼并插入至 DOM 中。另外，一個(gè)css選擇器可以在url中指定，像這樣，可以使用匹配selector選擇器的HTML內(nèi)容來(lái)更新集合。
Set the html contents of the current collection to the result of a GET Ajax call to the given URL. Optionally, a CSS selector can be specified in the URL, like so, to use only the HTML content matching the selector for updating the collection:
$('#some_element').load('/foo.html #bar')
當(dāng)這種方法執(zhí)行, 它將檢索 foo.html 頁(yè)面的內(nèi)容，Zepto會(huì)獲取ID為bar元素的內(nèi)容，并且插入到ID為 some_element 元素，而其他的被檢索到的元素將被廢棄。
如果css選擇器不存在。將使用完整的返回文本。
請(qǐng)注意，在沒(méi)有選擇器的情況下，任何javascript塊都會(huì)執(zhí)行。如果帶上選擇器，匹配選擇器內(nèi)的script將會(huì)被刪除。
serialize
serialize() ? string
在Ajax post請(qǐng)求中將用作提交的表單元素的值編譯成 URL-encoded 字符串。
serializeArray
serializeArray() ? array
將用作提交的表單元素的值編譯成擁有name和value對(duì)象組成的數(shù)組。不能使用的表單元素，buttons，未選中的radio buttons/checkboxs 將會(huì)被跳過(guò)。結(jié)果不包含file inputs的數(shù)據(jù)。
$('form').serializeArray()
//=> [{ name: 'size', value: 'micro' },
// { name: 'name', value: 'Zepto' }]
submit
submit() ? self
submit(function(e){ ... }) ? self
為 "submit" 事件綁定一個(gè)處理函數(shù)，或者觸發(fā)元素上的 "submit" 事件。當(dāng)參數(shù)function沒(méi)有給出時(shí)，觸發(fā)當(dāng)前表單“submit”事件，并且執(zhí)行默認(rèn)的提交表單行為，除非調(diào)用了
preventDefault()。
當(dāng)function參數(shù)給出時(shí)，在當(dāng)前元素上它簡(jiǎn)單得為其在“submit”事件綁定一個(gè)處理函數(shù)。
效果
$.fx
全局動(dòng)畫(huà)設(shè)置：
-
$.fx.off (在支持css transition 的瀏覽器中默認(rèn)為false)：設(shè)置true來(lái)禁止所有animate() transitions。
-
$.fx.speeds：用來(lái)設(shè)置動(dòng)畫(huà)時(shí)間的對(duì)象。
_default (400 ms)fast (200 ms)slow (600 ms)
改變現(xiàn)有值或者添加一個(gè)新屬性去影響使用一個(gè)字符串來(lái)設(shè)置時(shí)間的動(dòng)畫(huà)。
Change existing values or add new properties to affect animations that use
a string for setting duration.
animate
animate(properties, [duration, [easing, [function(){ ... }]]]) ? self
animate(properties, { duration: msec, easing: type, complete: fn }) ? self
animate(animationName, { ... }) ? self
對(duì)當(dāng)前Zepto集合對(duì)象中元素進(jìn)行css transition屬性平滑過(guò)渡。
properties: 一個(gè)對(duì)象，該對(duì)象包含了css動(dòng)畫(huà)的值，或者css幀動(dòng)畫(huà)的名稱(chēng)。duration (默認(rèn) 400)：以毫秒為單位的時(shí)間，或者一個(gè)字符串。
easing (默認(rèn) linear)：指定動(dòng)畫(huà)的緩動(dòng)類(lèi)型，使用以下一個(gè)：
complete：動(dòng)畫(huà)完成時(shí)的回調(diào)函數(shù)
Zepto 還支持以下 CSS transform 屬性：
translate(X|Y|Z|3d)rotate(X|Y|Z|3d)scale(X|Y|Z)matrix(3d)perspectiveskew(X|Y)
如果duration參數(shù)為 0 或
$.fx.off 為 true(在不支持css transitions的瀏覽器中默認(rèn)為true)，動(dòng)畫(huà)將不被執(zhí)行；替代動(dòng)畫(huà)效果的目標(biāo)位置會(huì)即刻生效。類(lèi)似的，如果指定的動(dòng)畫(huà)不是通過(guò)動(dòng)畫(huà)完成，而且動(dòng)畫(huà)的目標(biāo)位置即可生效。這種情況下沒(méi)有動(dòng)畫(huà)，
complete方法也不會(huì)被調(diào)用。
如果第一個(gè)參數(shù)是字符串而不是一個(gè)對(duì)象，它將被當(dāng)作一個(gè)css關(guān)鍵幀動(dòng)畫(huà) CSS
keyframe animation的名稱(chēng)。
$("#some_element").animate({
opacity: 0.25,
left:
'50px',
color:
'#abcdef',
rotateZ:
'45deg',
translate3d: '0,10px,0'
}, 500,
'ease-out')
Zepto只使用css過(guò)渡效果的動(dòng)畫(huà)。jquery的easings不會(huì)支持。jquery的相對(duì)變化("=+10px") syntax 也不支持。請(qǐng)查看
list of animatable properties。瀏覽器的支持可能不同，所以一定要測(cè)試你所想要支持的瀏覽器。
觸控
Touch events
“touch”模塊添加以下事件，可以 on 和 off。
tap —元素tap的時(shí)候觸發(fā)。singleTap and doubleTap — 這一對(duì)事件可以用來(lái)檢測(cè)元素上的單擊和雙擊。(如果你不需要檢測(cè)單擊、雙擊，使用
tap 代替)。
longTap — 當(dāng)一個(gè)元素被按住超過(guò)750ms觸發(fā)。swipe, swipeLeft, swipeRight, swipeUp,
swipeDown — 當(dāng)元素被劃過(guò)時(shí)觸發(fā)。(可選擇給定的方向)
這些事件也是所有Zepto對(duì)象集合上的快捷方法。
<style>.delete
{ display:
none;
}</style>
<ul
id=items>
<li>List item 1 <span
class=delete>DELETE</span></li>
<li>List item 2 <span
class=delete>DELETE</span></li>
</ul>
<script>
// show delete buttons on swipe
$('#items li').swipe(function(){
$('.delete').hide()
$('.delete',
this).show()
})
// delete row on tapping delete button
$('.delete').tap(function(){
$(this).parent('li').remove()
})
</script>