欢迎使用我的 在线工具

小D

读历史、看小说、写程序都是我所爱。技术不好,头脑不灵光,靠的是兴趣。
随笔 - 35, 文章 - 25, 评论 - 13, 引用 - 0
数据加载中……

jVaga,蛋疼的JS库

很简单的,没多少代码,应该还有很多BUG,先做个标记在这里。
我的目标就是Make you easy use
主要就是模仿Jquery的使用,肯定没有jquery强大,但是肯定也要简单许多。
1. 能使用jVaga.extend进行对象扩展(prototype.js)。
2. 能进行简单的浏览器类型判断,jVaga.B,如果是IE则会返回IE版本号,如果是其它浏览器只会是布尔值。
3. 能使用jVaga()或者$,进行元素选择,你也可以使用jVaga.util.setNamespace自定义选择器标志符。
   选择器返回的是包装后的JS对象,你可以直接调用它提供的各种便利的方法。
    选择器用法:
  1 <!DOCTYPE html>
  2 <html lang="cn">
  3     <head>
  4         <meta charset="utf-8" />
  5         <script type="text/javascript" src="jvaga-0.3.0.js"></script>
  6         <script type="text/javascript">
  7 /*        window.onload = function(){
  8                 var dd = document.getElementById("track");
  9         alert(dd.getAttribute);
 10         }
 11 */
 12           $(function(){
 13 
 14 // test1 : 命名空间设置             
 15 //             jVaga.util.setNamespace("$_$");
 16 //             alert($_$("#track"));
 17 // test : id
 18 //             alert($("#track"));
 19 /*$(".logo").each(function(e){
 20   alert(e.hasClass("logo1"));
 21 });
 22 */
 23 // class 选择,class检测, find二次选择,属性值获取,tagName选择
 24 //alert($(".logo")[0].hasClass("logo"));
 25 //alert($(".logo")[0].find("img")[0].attr('src'));
 26 //alert($("a")[0].text());
 27 // 链式使用
 28 //alert($(".logo")[0].find("img")[0].attr('src','xxxx.gif').attr('src'));
 29 // $("#ddd") $("[name='sds']:first > ") $("input") 
 30 // 浏览器测试
 31 //alert($.B.IE);
 32 //alert($.B.OP);
 33 //alert($.B.WK);
 34 //alert($.B.GK);
 35 //alert($.B.MS);
 36 
 37           });
 38         </script>
 39     </head>
 40     <body>
 41         
 42       <div class="header">
 43           <div class="logo"><img src="images/logo.png" /></div>
 44           <div id="track">
 45            <a href="#">首页</a>
 46            <span class="arrow">&gt;&gt;</span>
 47            绘图优化
 48         </div>
 49       </div>
 50      <div id="main">
 51       <div class="blocks">
 52       
 53         <div id="leaveBlank">
 54            想象力的留白
 55       </div>
 56    
 57     <div class="block">
 58          <div id="userInfo">
 59              <h3>个人信息</h3>
 60             <img src="images/userhead.jpg">
 61          </div>
 62        </div>
 63           <div class="article">
 64           <div class="title">
 65               <div class="title_cont">
 66                   我的文章标题
 67               </div>
 68               <div class="tag">
 69                   标签1 标签2
 70               </div>
 71           </div>
 72      </div>
115        
116     </body>
117 </html>
4. jVaga.util下面有各种的工具函数,如:
    toArray函数将参数转换成数组;addClass2TagNext给指定的标签的元素的下一个元素节点运用class;
    loadScript函数动态加载JS包;getEvent函数,兼容浏览器的Event对象的获取。
5. 给数组类型加入了each函数,能方便的遍历每个元素;给String加入了trim函数。
6. 提供了便利的Ajax支持,(为提供效率,使用了HttpRequest对象连接池,不知道是不是好的实践呢?)jVaga.Post对应post方式的AJax请求,jVaga.get就是get方式的了。
7. 。。。。

你可以自由的使用该工具,但是本人不保证其效率及功能的完整性,如果能有任何的反馈,我会很乐意的修改,如果你能将该工具用于任何的项目中,我也十分的荣幸,不过请保留本人的名字。

--------------------------------------蛋疼的分割线---------------------------------
一不小心就0.3.1版本了,主要做了如下修改:
# 这个版本主要对于节点选择器内部实现的改进
# 简单来说,因为IE8+及Chrome、Safari、Firefox比较新的版本中
# 都实现了比较好的选择器querySelector及querySelectorAll,这些选择器
# 比我用Javascript实现的选择器,效率不知高多少倍,所以我在内部需要
# 适配使用该接口实现。
+ 只是针对Css ClassName的选择的时候,应用了querySelectorAll,其它的情况下
  也是无法应用该接口


而用法还是如上面,所示:
新版本的代码在这里下载

posted on 2011-07-12 12:04 vagasnail 阅读(262) 评论(0)  编辑  收藏 所属分类: js


只有注册用户登录后才能发表评论。


网站导航: