公司的师兄原来写了个dom选择器，感觉不错啊！！！原来自己从来没有想过能写这些，所以我们今天一起来试试吧

我写的这个很简单，就是最简单的那种了，但是公司师兄写的很好。。。。。。

简单dom选择器

先上个完整的代码吧，因为我已经写起了：

  1 
  2 
  3     
  4 
  5 
  6     

  7         

  8             

  9             
 10             
 11         
 12         

 13         
 14         

 15         
 16         

 17             

 18                 
 19             
 20         
 21         
 22     
 23     
167 
168 

 1 

 2     

 3         

 4         
 5         
 6     
 7     

 8     
 9     

10     
11     

12         

13             
14         
15     
16     
17 

简单的结果，然后我们来简单看看代码：

  1 (function () {
  2     var queryFunc = {
  3         '#': function (id) {
  4             var arr = [];
  5             arr.push(document.getElementById(id))
  6             return arr;
  7         },
  8         '.': function (className) {
  9             var els = document.getElementsByTagName('*');
 10             var reg = new RegExp('(^|\s)' + className + '(\s|$)');
 11             var arr = [];
 12             for (var i = 0, len = els.length; i 

基本思路
① 获取选择器字符串，并将之分解为一个数组

var explodeSelector = function (str) {
    if (!str) return [];
    //第一步去掉多余的空格
    str = str.replace(/s+/g, ' ');
    var arr = str.split(' ');
    return arr;
};
② 与CSS选择器一致，根据各种条件选取相关元素
 1 var queryFunc = {
 2     '#': function (id) {
 3         var arr = [];
 4         arr.push(document.getElementById(id))
 5         return arr;
 6     },
 7     '.': function (className) {
 8         var els = document.getElementsByTagName('*');
 9         var reg = new RegExp('(^|\s)' + className + '(\s|$)');
10         var arr = [];
11         for (var i = 0, len = els.length; i 
③ 根据选择器与获得的dom数组，判断其父元素是否具有相关属性（id，className，tag），有便留下来，没有就不管他
过滤下来的就是我们要的元素：
 1 var filterFunc = {
 2     '#': function (el, id) {
 3         return this.commomFunc(el, function (p) {
 4             if (p.id == id) {
 5                 return true;
 6             }
 7         });
 8     },
 9     '.': function (el, className) {
10         var reg = new RegExp('(^|\s)' + className + '(\s|$)');
11         return this.commomFunc(el, function (p) {
12             if (reg.test(p.className)) {
13                 return true;
14             }
15         });
16     },
17     'tag': function (el, tag) {
18         return this.commomFunc(el, function (p) {
19             if (p.tagName.toLowerCase() == tag) {
20                 return true;
21             }
22         });
23     },
24     commomFunc: function (el, callback) {
25         var p = el;
26         var end = false;
27         while (!end) {
28             p = p.parentNode || p.parentElement || null;
29             if (!p) return false;
30             var b = callback && callback(p);
31             if (b) return b;
32             if (p.tagName == 'BODY') {
33                 end = true;
34             }
35         }
36         return false;
37     }
38 };

 1 var queryAll = function (str) {
 2     var arrSelector = explodeSelector(str);
 3     var len = arrSelector.length;
 4 
 5     //当前索引
 6     var index = len - 2;
 7     var curDom = null;
 8     var curSelector = null;
 9 
10     //第一轮筛选出来的元素
11     var els = query(arrSelector[len - 1]);
12     //只有一个选择器便直接返回了
13     if (len == 1) return els;
14 
15     while (index != -1) {
16         //获取当前的筛选选择器
17         curSelector = arrSelector[index];
18         var tmpArr = [];
19         for (var i = 0, len = els.length; i 
④，然后，就没有然后了。。。。
不足与提高
这个代码明显就是玩具，三无产品：
① 无测试
② 无子选择器/兄弟选择器
③ 无性能
但是，以上东西暂时和我无关啦，因为学习嘛。。。。
最后附上师兄选择器代码：
  1 html>
  2 
  3 
  4     
  5     
217 
218 
219     

220         

221             
222                 用户名:
223             
224         
225         
226 //使用方法
227 alert(aiQuery('.aaa .bbb [type=text]'));
228 alert(aiQuery('.aaa label + input'));
229 alert(aiQuery('#username'));
230 
231     
232     
237 
238 
然后，就没有然后了。。。
小插曲-浮点数计算
今天项目重遇到一个问题，我和我的小伙伴都惊呆了：
你没有看错，33.1 * 3 就是那么多！！！
尼玛已证明这是一个js的bug，我可以这么说么？？？
解决方案，求回复！
parseInt(33.1 * 3 * 100) / 100