Yahoo! User Interface Library，YUI，YUI下载，YUI学习，YUI是什么,YUI浅谈，YUI研究(1)
公司项目要用到Yahoo UI，下午只好硬着头皮去学了，但是发现网上关于这方面的中文资料很少，可能各位高手都在写代码呢，所以我写这篇学习心得帮助下和我一样的新人，无意卖弄，如果写的不好还请各位见谅啊。Yahoo UI是什么我不多讲了，自己可以去baidu下。访问 http://developer.yahoo.com/yui 上面可以下载Yahoo UI 2.2.0最新版。解压缩到硬盘上。根目录有3个文件夹build（开发用到的包）、docs（Yahoo UI API）、examples（例子），基本上文档还是相当齐全的，再加上 http://developer.yahoo.com/yui 页面左侧的每一个控件导航说明，我们可以开始研究了。
最新版下载地址： http://sourceforge.net/project/downloading.php?group_id=165715&filename=yui_2.3.1.zip
看了这么多控件，无从下手，我决定先从calendar下手，这是一个日历，感觉上相对关联的类库应该少一些，比较简单。先看看examples里面的例子，好多啊，先来一个最简单的Quickstart Tutorial，查看下页面源代码，总体对Yahoo UI的使用有了一个大致的了解。
在你使用的UI控件的页面组成有3大块：
第一块导入依赖的JS文件和CSS文件；
第二块控件实现的JS代码；
第三块插入到当中的控件，实际就是。
OK！我们开始使用它吧，把开发需要用的包全部放到项目中去，我是把build文件整个copy过来了，你可以根据自己的需要选择，但是基本上都会用到 yahoo、event、dom这3个包。在自己的项目中新建一个页面，htm、jsp、asp等等什么都可以了，我是用jsp的。
第一块在内插入：
<script>"text/javascript" src="build/yahoo/yahoo.js"></script>
<script>"text/javascript" src="build/event/event.js"></script>
<script>"text/javascript" src="build/dom/dom.js"></script>
<script>"text/javascript" src="build/calendar/calendar.js"></script>
<link type="text/css" rel="stylesheet" href="build/calendar/assets/calendar.css" />
这段代码大家应该很好理解了，注意src后面的路径要写正确，不然就看不到显示效果了。
第二块写实现控件的JS代码了：
<script>
YAHOO.namespace("example.calendar");
function init() {
YAHOO.example.calendar.cal = new YAHOO.widget.Calendar("cal","caler");
YAHOO.example.calendar.cal.render();
}
YAHOO.util.Event.addListener(window, "load", init);
</script>
这几行代码都要写，因为要依赖的，具体函数实现我没有去研究，但是可以看到参数，我们基本可以理解了YAHOO这个对象应该是个全局的对象（本人JS没学过，不知道这个术语对不对），namespace()定义一个名称空间，这句话去掉浏览器就会报错说找不到YAHOO.example.calendar，那我们就暂且理解为namespace()可以初始化YAHOO的上下文了。接下来就开始new一个Calendar对象了，注意第二个参数，我们在div的时候会用到。最后加入了一个load窗口的事件，OK，这个流程基本清楚了。
第三块，在里面写一个div,注意id属性就是初始化Calendar对象的第二个参数。
把小猫跑起来吧，看看，是不是出现了一个简单的日历了。Yahoo UI还提供了对Calendar的其他功能以及复杂的Calendar，但是由于我时间有限，我只能抛砖引玉了，希望大家自己去按照这个思路研究，不是很难的，注意：研究的时候多看看 http://developer.yahoo.com/yui 页面左侧的每一个控件导航说明，虽然是E文，但是还是可以看懂的。我的目标是DataTable和TreeView。
好像Yui-ext现在和JQuery结合了,看样子有意思完全脱离Yui了
Yahoo! User Interface Library，YUI，YUI下载，YUI学习，YUI是什么,YUI浅谈，YUI研究(1)相关推荐
- Yahoo! User Interface Library，YUI，YUI下载，YUI学习，YUI是什么,YUI浅谈，YUI研究(2)
Yahoo! User Interface Library(简称yui) 是一个使用Javascrīpt编写的工具和控件库.它利用DOM脚本,DHTML和AJAX来构造具有丰富交互功能的Web程序.y ...
- YUI(Yahoo User Interface)介绍
在Web 2.0中,SaaS前端不再是一个简单网页.它可以拥有非常Cool的界面,它也可以拥有非常复杂的逻辑.现在,构建一个复杂的SaaS前段界面主要有下面三种技术路线: DHTML(HTML,CSS ...
- linux绝育玩客云_绝育老母鸡（玩客云）pt下载浅谈
绝育老母鸡(玩客云)pt下载浅谈 2020-01-22 19:35:25 55点赞 346收藏 111评论 是返乡过年?还是就地过年?最新一届#双面过节指南#开始啦!本次征稿活动分为A面返乡和B面就地 ...
- Android Studio下载搭建学习笔记01
Android Studio下载搭建学习笔记01 下载Android Studio 安装Android Studio 进入安装向导 选择安装组件 选择安装位置 选择文件菜单 等待安装 启动并配置And ...
- jQuery 和 YUI (Yahoo User Interface) 各自的优缺点有哪些？具体的使用场景是怎样的？...
张经纬,前端工程师 知乎用户.赵勇杰.知乎用户 等人赞同 其实jQuery和YUI的侧重点是不一样的. jQuery专注于DOM的操作,他通过继承的方式给传入的对象增加了新的方法,从而使我们可以通过链 ...
- Yahoo邮箱中全部邮件的下载保存
一大早起来就看到Yahoo中国邮箱不能再继续使用了,Yahoo涅磐,本以为邮箱应该会躲过这一劫,没想到还是来了. 最简单的方法应该是迁移到yahoo.com吧,但是之前用这个yahoo.cn的邮箱,时 ...
- C++学习书籍推荐《The C++ Standard Library 2nd》下载
百度云及其他网盘下载地址:点我 编辑推荐 经典C++教程十年新版再现,众多C++高手和读者好评如潮 畅销全球.经久不衰的C++ STL鸿篇巨著 C++程序员案头必 备的STL参考手册 全面涵盖C+ ...
- Java library util_sdejavautil.dll,下载,简介,描述,修复,等相关问题一站搞定_DLL之家
如何选择&使用 第一步:您从我们网站下载下来文件之后,先将其解压(一般都是zip压缩包). 第二步:然后根据您系统的情况选择X86/X64,X86为32位电脑,X64为64位电脑. 如果您不知 ...
- The Standard C Library电子书pdf下载
C标准库(英文版)电子书pdf下载链接: https://pan.baidu.com/s/1i807V-Fbaje4x_G2E3hPzg 提取码获取方式:关注下面微信公众号,回复关键字:1145
最新文章
- 接入层的流程和非接入层
- SpringBoot 获取 application.properties 文件中的内容方法 【学习记录】
- springmvc进阶（5）：mvc:default-servlet-handler详解
- WDS系列--Windows Deployment Services概述篇
- 项目--教师日常办公平台中的活动图
- html %3ca id=%3e,a.markdown
- itextsharp c# asp.net 生成 pdf 文件
- ios 返回指定导航控制器
- .net面向对象学习笔记
- 安装zabbix服务器端
- 用laravel开发php,使用 PhpStorm开发Laravel项目
- ensp华为数通远程登录配置
- 多线程小题 —— 设计火车票模拟程序
- 主成分分析二级指标权重_因子分析法如何确定主成分及各个指标的权重？
- JS对象（对象的创建、属性的增删改查、属性的检测和枚举）
- 你的六岁在玩儿泥巴，他们六岁已经在讲算法了
- MySQL——事务(Transaction)详解
- SpringBoot企业微信点餐系统
- golang识别身份证号
- 饥荒为啥显示专用服务器,饥荒服务器和专用服务器有什么区别 | 手游网游页游攻略大全...