jVaga,蛋疼的JS庫(kù)
很簡(jiǎn)單的,沒(méi)多少代碼,應(yīng)該還有很多BUG,先做個(gè)標(biāo)記在這里。
我的目標(biāo)就是Make you easy use。
主要就是模仿Jquery的使用,肯定沒(méi)有jquery強(qiáng)大,但是肯定也要簡(jiǎn)單許多。
1. 能使用jVaga.extend進(jìn)行對(duì)象擴(kuò)展(prototype.js)。
2. 能進(jìn)行簡(jiǎn)單的瀏覽器類型判斷,jVaga.B,如果是IE則會(huì)返回IE版本號(hào),如果是其它瀏覽器只會(huì)是布爾值。
3. 能使用jVaga()或者$,進(jìn)行元素選擇,你也可以使用jVaga.util.setNamespace自定義選擇器標(biāo)志符。
選擇器返回的是包裝后的JS對(duì)象,你可以直接調(diào)用它提供的各種便利的方法。
選擇器用法:
toArray函數(shù)將參數(shù)轉(zhuǎn)換成數(shù)組;addClass2TagNext給指定的標(biāo)簽的元素的下一個(gè)元素節(jié)點(diǎn)運(yùn)用class;
loadScript函數(shù)動(dòng)態(tài)加載JS包;getEvent函數(shù),兼容瀏覽器的Event對(duì)象的獲取。
5. 給數(shù)組類型加入了each函數(shù),能方便的遍歷每個(gè)元素;給String加入了trim函數(shù)。
6. 提供了便利的Ajax支持,(為提供效率,使用了HttpRequest對(duì)象連接池,不知道是不是好的實(shí)踐呢?)jVaga.Post對(duì)應(yīng)post方式的AJax請(qǐng)求,jVaga.get就是get方式的了。
7. 。。。。
你可以自由的使用該工具,但是本人不保證其效率及功能的完整性,如果能有任何的反饋,我會(huì)很樂(lè)意的修改,如果你能將該工具用于任何的項(xiàng)目中,我也十分的榮幸,不過(guò)請(qǐng)保留本人的名字。
--------------------------------------蛋疼的分割線---------------------------------
一不小心就0.3.1版本了,主要做了如下修改:
# 這個(gè)版本主要對(duì)于節(jié)點(diǎn)選擇器內(nèi)部實(shí)現(xiàn)的改進(jìn)
# 簡(jiǎn)單來(lái)說(shuō),因?yàn)镮E8+及Chrome、Safari、Firefox比較新的版本中
# 都實(shí)現(xiàn)了比較好的選擇器querySelector及querySelectorAll,這些選擇器
# 比我用Javascript實(shí)現(xiàn)的選擇器,效率不知高多少倍,所以我在內(nèi)部需要
# 適配使用該接口實(shí)現(xiàn)。
+ 只是針對(duì)Css ClassName的選擇的時(shí)候,應(yīng)用了querySelectorAll,其它的情況下
也是無(wú)法應(yīng)用該接口
而用法還是如上面,所示:
新版本的代碼在這里下載
我的目標(biāo)就是Make you easy use。
主要就是模仿Jquery的使用,肯定沒(méi)有jquery強(qiáng)大,但是肯定也要簡(jiǎn)單許多。
1. 能使用jVaga.extend進(jìn)行對(duì)象擴(kuò)展(prototype.js)。
2. 能進(jìn)行簡(jiǎn)單的瀏覽器類型判斷,jVaga.B,如果是IE則會(huì)返回IE版本號(hào),如果是其它瀏覽器只會(huì)是布爾值。
3. 能使用jVaga()或者$,進(jìn)行元素選擇,你也可以使用jVaga.util.setNamespace自定義選擇器標(biāo)志符。
選擇器返回的是包裝后的JS對(duì)象,你可以直接調(diào)用它提供的各種便利的方法。
選擇器用法:
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 : 命名空間設(shè)置
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檢測(cè), find二次選擇,屬性值獲取,tagName選擇
24 //alert($(".logo")[0].hasClass("logo"));
25 //alert($(".logo")[0].find("img")[0].attr('src'));
26 //alert($("a")[0].text());
27 // 鏈?zhǔn)绞褂?/span>
28 //alert($(".logo")[0].find("img")[0].attr('src','xxxx.gif').attr('src'));
29 // $("#ddd") $("[name='sds']:first > ") $("input")
30 // 瀏覽器測(cè)試
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="#">首頁(yè)</a>
46 <span class="arrow">>></span>
47 繪圖優(yōu)化
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>個(gè)人信息</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 我的文章標(biāo)題
67 </div>
68 <div class="tag">
69 標(biāo)簽1 標(biāo)簽2
70 </div>
71 </div>
72 </div>
115
116 </body>
117 </html>
4. jVaga.util下面有各種的工具函數(shù),如: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 : 命名空間設(shè)置
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檢測(cè), find二次選擇,屬性值獲取,tagName選擇
24 //alert($(".logo")[0].hasClass("logo"));
25 //alert($(".logo")[0].find("img")[0].attr('src'));
26 //alert($("a")[0].text());
27 // 鏈?zhǔn)绞褂?/span>
28 //alert($(".logo")[0].find("img")[0].attr('src','xxxx.gif').attr('src'));
29 // $("#ddd") $("[name='sds']:first > ") $("input")
30 // 瀏覽器測(cè)試
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="#">首頁(yè)</a>
46 <span class="arrow">>></span>
47 繪圖優(yōu)化
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>個(gè)人信息</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 我的文章標(biāo)題
67 </div>
68 <div class="tag">
69 標(biāo)簽1 標(biāo)簽2
70 </div>
71 </div>
72 </div>
115
116 </body>
117 </html>
toArray函數(shù)將參數(shù)轉(zhuǎn)換成數(shù)組;addClass2TagNext給指定的標(biāo)簽的元素的下一個(gè)元素節(jié)點(diǎn)運(yùn)用class;
loadScript函數(shù)動(dòng)態(tài)加載JS包;getEvent函數(shù),兼容瀏覽器的Event對(duì)象的獲取。
5. 給數(shù)組類型加入了each函數(shù),能方便的遍歷每個(gè)元素;給String加入了trim函數(shù)。
6. 提供了便利的Ajax支持,(為提供效率,使用了HttpRequest對(duì)象連接池,不知道是不是好的實(shí)踐呢?)jVaga.Post對(duì)應(yīng)post方式的AJax請(qǐng)求,jVaga.get就是get方式的了。
7. 。。。。
你可以自由的使用該工具,但是本人不保證其效率及功能的完整性,如果能有任何的反饋,我會(huì)很樂(lè)意的修改,如果你能將該工具用于任何的項(xiàng)目中,我也十分的榮幸,不過(guò)請(qǐng)保留本人的名字。
--------------------------------------蛋疼的分割線---------------------------------
一不小心就0.3.1版本了,主要做了如下修改:
# 這個(gè)版本主要對(duì)于節(jié)點(diǎn)選擇器內(nèi)部實(shí)現(xiàn)的改進(jìn)
# 簡(jiǎn)單來(lái)說(shuō),因?yàn)镮E8+及Chrome、Safari、Firefox比較新的版本中
# 都實(shí)現(xiàn)了比較好的選擇器querySelector及querySelectorAll,這些選擇器
# 比我用Javascript實(shí)現(xiàn)的選擇器,效率不知高多少倍,所以我在內(nèi)部需要
# 適配使用該接口實(shí)現(xiàn)。
+ 只是針對(duì)Css ClassName的選擇的時(shí)候,應(yīng)用了querySelectorAll,其它的情況下
也是無(wú)法應(yīng)用該接口
而用法還是如上面,所示:
新版本的代碼在這里下載
posted on 2011-07-12 12:04 vagasnail 閱讀(268) 評(píng)論(0) 編輯 收藏 所屬分類: js