很简单的,没多少代码,应该还有很多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">>></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,其它的情况下
也是无法应用该接口而用法还是如上面,所示:
新版本的代码在
这里下载