Mango(芒果) javascript库

什么是mango

mango是以webkit为内核的浏览器专门编写的javascript库, api高仿jquery api

mango在BSD协议下开源发布

为什么会写mango.js

因为webkit，现在越来越多的公司产品是用native程序包一个webkit内核用html5 来实现UI交互界面，而交互界面javascript又扮演着至关重要的角色。 Jquery几乎成了大多数公司选择的javascript库，如果你作为一个jser连jquery都不会用，那你就别混了，亲。

但是jquery并不是专门针对webkit的

jquery的包袱

jquery的特点就是write less do more并兼容各型浏览器，这是伟大的创举，同时也是其包袱，各种兼容浏览器的代码，各种为了write less而发明的选择器，方便我们程序人员的同时它却是自己的包袱，这也至使其付出性能代价。

如果你的应用是安装在移动端，或者是应用在硬件性能并不怎么好的android设备上，你就会关心jquery的性能问题了

mango放下了jquery的包袱

1、抛弃了各形浏览器兼容的代码专为webkit内核的浏览器而写；

2、直接使用了html5所原生支持的selector选择器；

3、使用最新的html5 提供的api 最大可能提升性能；

4、提供与jquery 95%一至的api,减少学习成本；

mango是否是重复造轮子？

mango只是提供了与jquery api几乎一至的api，但它却是纯为webkit而生的，也有别于zepto之类的javascript库。Mango就是用来写webkit内核的web app的，更纯粹。

mango的性能

经过测试mango的api性能

全面超越jquery1.3、jquery1.7、jquery2.0、zepto、jq.mobi

使用到的H5新DOM API

• querySelector
• querySelectorAll
• previousElementSibling
• nextElementSibling
• webkitMatchesSelector
• dataset
• classList
• insertAdjacentHTML

自行选用mango的模块

根据web app的简繁程度可以自由选择mango所需要的模块来选择mango文件，达到最小化mango文件

---

mango的模块及api

DOM模块

• find
• remove
• empty
• html
• text
• show
• hide
• siblings
• add
• addBack
• end
• closest
• parents
• parentsUntil
• children
• contents
• eq
• get
• first
• last
• each
• prop
• removeProp
• attr
• removeAttr
• val
• data
• parent
• offset
• css
• has
• is
• filter
• index
• addClass
• removeClass
• toggleClass
• hasClass
• before
• after
• scrollLeft
• scrollTop
• append
• appendTo
• prepend
• prependTo
• next
• nextAll
• nextUntil
• prev
• prevall
• prevUntil
• width
• innerWidth
• outerWidth
• height
• innerHeight
• outerHeight

Events模块

注：支持自定义事件及事件命名空间 ，命名空间以’/’符分隔

• On
• Off
• Hover
• Trigger
• One

(各种快捷事件)

click,dblclick,focusout,mousedown,mousemove,mouseout,mouseover,mouseup, change,select, focus, blur, scroll, resize,submit,keydown,keypress,keyup,error

Ajax模块

• $.ajax
• $.getJson

---

decoupling 解耦模块

解耦模块中包含了:

Deferred、Callbacks、Broadcast

在很多情况下mango更建议使用Broadcast

Broadcast是一个强大的订阅发布系统（订阅者设计模式），

Deferred和Callbacks也是建议在Broadcast基础上的，这点与jquery的Deferred和Callbacks实现方式不一样 mango刻意简化了Deferred和Callbacks

---

静态方法

• $.extend
• $.param
• $.isArray
• $.isBoolean
• $.isDate
• $.isNumber
• $.isObject
• $.isFunction
• $.isRegExp
• $.isString
• $.each

---

Todo list

#ajax模块完善

#更多的静态方法增加

#更多的jquery api

---

如何使用

在html中引用mango

"mango.js"

接下来就可以像使用jquery一样使用mango了