Skip to content

Latest commit

 

History

History
175 lines (150 loc) · 5.5 KB

README.md

File metadata and controls

175 lines (150 loc) · 5.5 KB
Raw

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了