#

核心方法

$()

• $(selector, [context]) ⇒ collection
• $() ⇒ same collection
• $() ⇒ collection
• $(htmlString) ⇒ collection
• $(htmlString, attributes) ⇒ collection v1.0+
• Zepto(function($){ … })

通过执行css选择器，包装dom节点，或者通过一个html字符串创建多个元素 来创建一个Zepto集合对象。

Zepto集合是一个类似数组的对象，它具有链式方法来操作它指向的DOM节点，除了$( Zepto)对象上的直接方法外(如$.extend)，文档对象中的所有方法都是集合方法。

如果选择器中存在content参数(css选择器，dom，或者Zepto集合对象)，那么只在所给的节点背景下进行css选择器；这个功能和使用$(context).find(selector)是一样的。

当给定一个html字符串片段来创建一个dom节点时。也可以通过给定一组属性映射来创建节点。最快的创建但元素，使用<div>或 <div/>形式。

当一个函数附加在 DOMContentLoaded 事件的处理流程中。如果页面已经加载完毕，这个方法将会立即被执行。

1
2
3
4
5
6
7
8
9
10
11
12
13
14

$('div')  //=> 所有页面中得div元素
$('#foo') //=> ID 为 "foo" 的元素
// 创建元素:
$("<p>Hello</p>") //=> 新的p元素
// 创建带有属性的元素:
$("<p />", { text:"Hello", id:"greeting", css:{color:'darkblue'} })
//=> <p id=greeting style="color:darkblue">Hello</p>
// 当页面ready的时候，执行回调:
Zepto(function($){
alert('Ready to Zepto!')
})

不支持jQuery CSS 扩展， 然而，可选的 “selector” 模块有限提供了支持几个最常用的伪选择器，而且可以被丢弃，与现有的代码或插件的兼容执行。

如果$变量尚未定义，Zepto只设置了全局变量$指向它本身。
允许您同时使用的Zepto和有用的遗留代码，例如，prototype.js。
只要首先加载Prototype，Zepto将不会覆盖Prototype的 $ 函数。
Zepto将始终设置全局变量Zepto指向它本身。

方法总览

$.camelCase

语法： $.camelCase(string) ⇒ string
将一组字符串变成“骆驼”命名法的新字符串，如果该字符已经是“骆驼”命名法，则不变化。

$.contains v1.0+

语法： $.contains(parent, node) ⇒ boolean
检查父节点是否包含给定的dom节点，如果a包含b,则返回true;
如果两者是相同的节点，则返回 false。

1
2
3
4
5
6
7
8
9

p = document.getElementById('parent'),
c = document.getElementById('child');
log(p.contains(c)); //true
log(c.contains(p));//false
//实现类似封装
$.contains = function (parent, node) {
    return parent !== node && parent.contains(node);
}

$.each

语法：$.each(collection, function(index, item){ … }) ⇒ collection
遍历数组元素或以key-value值对方式遍历对象。回调函数返回 false 时停止遍历。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

    $.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)
    })
    //输出的值为：
    item 0 is: a
    item 1 is: b
    item 2 is: c
    name: zepto.js
    size: micro
    //callback函数,如果我们的回调有一个返回了false，那么就会跳出整个循环，
    $.each = function (elements, callback) {
    var i, key
    if (likeArray(elements)) {
        for (i = 0; i < elements.length; i++)
            if (callback.call(elements[i], i, elements[i]) === false) 
            return elements
    } else {
        for (key in elements)
            if (callback.call(elements[key], key, elements[key]) === false) return elements
    }
    return elements
}

$.extend

语法： $.extend(target, [source, [source2, …]]) ⇒ target
语法： $.extend(true, target, [source, …]) ⇒ target v1.0+
通过源对象扩展目标对象的属性，源对象属性将覆盖目标对象属性。
默认情况下为，复制为浅拷贝（浅复制）。如果第一个参数为true表示深度拷贝（深度复制）。

1
2
3
4
5
6

var target = { one: 'patridge' },
    source = { two: 'turtle doves' }
$.extend(target, source)
//=> { one: 'patridge',
//     two: 'turtle doves' }

源对象和复制对象有相同的属性会被覆盖吗？答案是会的

然后看这个深度拷贝，就会递归的将复制对象的对象给复制过去

PS：深度克隆与浅克隆的区别是复制对象变了源对象相关属性不会跟着改变，这就是区别

$.fn

Zepto.fn是一个对象，它拥有Zepto对象上所有可用的方法，如 addClass()， attr()，和其它方法。在这个对象添加一个方法，所有的Zepto对象上都能用到该方法。

这里有一个实现 Zepto 的 empty() 方法的例子：

1
2
3

$.fn.empty = function(){
  return this.each(function(){ this.innerHTML = '' })
}

$.grep v1.0+

$.grep(items, function(item){ … }) ⇒ array
获取一个新数组，新数组只包含回调函数中返回 ture 的数组项。

1
2
3

$.grep([1,2,3],function(item){
    return item > 1
});//=>[2,3]

$.inArray v1.0+

$.inArray(element, array, [fromIndex]) ⇒ number
返回数组中指定元素的索引值（愚人码头注：以0为基数），如果没有找到该元素则返回-1。

愚人码头注：[fromIndex] 参数可选，表示从哪个索引值开始向后查找。

$.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。

$.isNumeric v1.2+

$.isNumeric(value) ⇒ boolean
如果该值为有限数值或一个字符串表示的数字，则返回ture。

$.isPlainObject v1.0+

$.isPlainObject(object) ⇒ boolean
测试对象是否是“纯粹”的对象，这个对象是通过 对象常量（”{}”） 或者 new Object 创建的，如果是，则返回true。

1
2
3
4

$.isPlainObject({})         // => true
$.isPlainObject(new Object) // => true
$.isPlainObject(new Date)   // => false
$.isPlainObject(window)     // => false

$.isWindow v1.0+

$.isWindow(object) ⇒ boolean
如果object参数为一个window对象，那么返回true。这在处理iframe时非常有用，因为每个iframe都有它们自己的window对象，使用常规方法obj === window校验这些objects的时候会失败。

$.map

$.map(collection, function(item, index){ … }) ⇒ collection
通过遍历集合中的元素，返回通过迭代函数的全部结果，（愚人码头注：一个新数组）null 和 undefined 将被过滤掉。

1
2
3
4
5
6
7
8
9

$.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]

$.noop v1.2+

var callback = $.noop
引用一个空函数（什么都不处理）。

$.parseJSON v1.0+

$.parseJSON(string) ⇒ object
原生JSON.parse方法的别名。（愚人码头注：接受一个标准格式的 JSON 字符串，并返回解析后的 JavaScript 对象。）

##　$.trim v1.0+
$.trim(string) ⇒ string
删除字符串首尾的空白符。类似String.prototype.trim()。

1
2
3

console.log($.trim("  你好，开源中国社区   "));
//或者(jquery)
console.log(jQuery.trim("   hello oschina  "));

$.type v1.0+

$.type(object) ⇒ string
获取JavaScript 对象的类型。
可能的类型有：

• null
• undefined
• boolean
• number
• string
• function
• array
• date
• regexp
• object
• error。

对于其它对象，它只是简单报告为“object”，如果你想知道一个对象是否是一个javascript普通对象，使用 isPlainObject。