kissy初体验（一）
简介：
如果你是个前端爱好者，并且热衷于看别人的源代码，您肯定会知道kissy。它是鼎鼎大名的淘宝的前端类库, 几乎在淘宝的每个页面上都能看到它的身影!它遵循的原则是小巧灵活、简洁实用、愉悦编码、快乐开发。如果你懂点jquery 或者Yui3，那更能快速入门了。
官网：http://docs.kissyui.com/
废话不多说，我们来做个例子体验下：
第一，下载kissy压缩包，现在版本已经到了1.3.0
https://github.com/kissyteam/kissy/archive/1.3.0.zip
第二，引入js文件
解压缩后，我们可以看到有很多文件。
两种方式引入：
1、引入build的kissy.js或者压缩的kissy-min.js
<script src="kissy-1.3.0/kissy-1.3.0/build/kissy-min.js" type="text/javascript"></script>
2、引入seed.js或者压缩的seed-min.js。这个只包含核心，并且引入了loader可以按需加载，大小也比较小。这个很多库都有，比如extjs，easyui等。
<script src="kissy-1.3.0/kissy-1.3.0/build/seed-min.js" type="text/javascript"></script> //按需加载
第三，编写代码
<script type="text/javascript">
KISSY.ready(function(S){
var Welcome = "Welcome to Web技术分享！";
alert(Welcome);
});
(function (S) {
var Welcome = "Welcome to Web技术分享！";
alert(Welcome);
})(KISSY);
KISSY.use('dom', function (S) {
var Welcome = "Welcome to Web技术分享！";
S.DOM.html('body', Welcome);
});
(function (S) {
var Welcome = "Welcome to Web技术分享l！";
S.use('dom', function () {
S.DOM.html('body', Welcome);
});
})(KISSY);
(function (S) {
var Welcome = "Welcome to Web技术分享l！";
S.use('dom', function (S,DOM) {
DOM.html('body', Welcome);
});
})(KISSY);
</script>
前面两段代码，其实跟jquery的一样，这里的KISSY就相当于$符号。这里采用了闭包，创建个匿名函数，然后，给匿名函数传参，在闭包内就可以使用S来代替Kissy了。这样可以有效地避免跟其他类库的冲突，并且看起来简洁有效。
后面三段代码，主要看use方法，它是loader里面的，就是按需加载。比如这边我加载了dom模块 ，可以对dom进行操作。你也可以直接引入core，
如：Kissy.use('core',function(){
});
core包含了dom操作、事件处理、动画、ajax等等。我们可以按需加载了。
如下是官方的一个例子 ：
KISSY.use('dom,event,anim',function(S,DOM,Event,Anim){
var btn = DOM.get('#demo-btn');//获取按钮 相当于jquery的$("#demo-btn")
Event.on(btn, 'click', function() { //单击事件，相当于jquery的$("#demo-btn").bind("click",function(){});等
DOM.attr(btn, 'disabled', true); //设置属性，相当于jquery的$("#demo-btn").attr('disabled',true);or $("#demo-btn").prop('disabled',true);
new Anim('#demo-img', 'left: 400px; opacity: 0', 2, 'easeOut',
function() {
new Anim('#demo-txt', 'left: 0; opacity: 1; fontSize: 28px', 2, 'bounceOut').run();
}).run();
});//动画效果。
});
效果