YUI介绍以及快速入门 Yahoo的JS框架

1、YUI介绍:

YUI库是一系列使用Javascript和CSS创建的的工具和控件集,用来创建富客户端Web应用。使用到了DOM scripting,DHTML和AJAX。

2、在页面中引入JS文件:

可以从官网下载YUI http://yuilibrary.com/yui/quick-start/ 然后引入页面,也可以在线引入

--> 3、开始使用YUI: 3.1、创建一个YUI沙箱:

创建一个YUI实例用于使用所有的YUI组建,也叫一个沙箱。每一个YUI沙箱都有它自己的一个实例和一套自己的激活了的模块,所以它不会与同一个页面中的其他沙箱冲突。任何定义在沙箱内的变量只会在本沙箱内有效,不会自动变成全局变量。

当声明一个沙箱 时,指定你想想要使用的模块,在上面的代码中,我们指定了使用node和even模块 。这样,我们就可以在这个沙箱内通过Y来使用node和evnet的API了。

YUI会管理需要依赖的各模块的运算和加载在你的页面中单一请求或者组合请求中需要使用到得JS文件。在所有的YUI模块加载完成后你的代码将会被执行。

3.2、在YUI中使用DOM节点

YUI中的节点组件使得使用,创建和操作DOM节点变得非常方便。节点API允许使用元素相关参照物或者选择器去使用DOM决节点

3.3、创建UI效果

使用Transition组件使得在你的用户交互中创建基于CSS的绚丽效果变得更加容易了。

3.4、使用Ajax加载内容

由node-load模块提供的Node.load()方法使得在页面运行时动态的添加内容更方便了。

本问由arthinking翻译,查看英文原文:http://yuilibrary.com/yui/quick-start/

arthinking wechat
欢迎关注itzhai公众号