运用$来封装函数，实现元素的查询

一、tools编写
/**

• 根据选择器查找元素
• @param selector 选择器，可取 #id .class element
• @param context 查询上下文，即在该DOM元素后代查找满足选择器条件的元素，默认在 document 中查找
• @return 返回查找到的元素（根据id查找时返回的是查找到的DOM对象，根据类名或元素名查找时，返回的是 HTMLCollection）
  */

    // 如果未传递 context 参数，则默认取 document 值
    context = context || document;

    if (selector.indexOf("#") === 0) // id
        return document.getElementById(selector.slice(1)); 
        //截取后半部分来比对成功的元素都将放入对应的对象里
    if (selector.indexOf(".") === 0) // className
        return byClassName(selector.slice(1), context);
    // element
    return context.getElementsByTagName(selector);
}

/**
 * 解决根据类名查找元素浏览器兼容
 * @param className  待查找的类名
 * @param context  查询上下文，即在该DOM元素后代查找满足选择器条件的元素，默认在 document 中查找
 * @return 返回查找到的元素
 */
function byClassName(className, context) {
    // 默认在 document 文档中查找当context为空被赋document
    context = context || document;

    /* 支持使用 getElementsByClassName 方法，则直接使用 */
    /**
    *context.getElementsByClassName <=> context.getElementsByClassName !== undefined;
    undefined的boolean值为false 。浏览器发现不兼容则getElementsByClassName返回false
    */
    // if (context.getElementsByClassName) //
    //  return context.getElementsByClassName(className);

    /* 不支持使用 getElementsByClassName 方法 */
    // 保存所有查找到元素的数组
    var _result = []; 
    // 将查询上下文后代中所有元素查找出来 获取到的不是数组而是一个类似于数组的对象（泛型集合）
    var _tags = context.getElementsByTagName("*");
    console.log(_tags);
    // 遍历迭代所有元素
    for (var i = 0, len = _tags.length; i < len; i++) {
        // 获取当前遍历到元素的所有类名 _tags[i]是一个泛型集合通过className来进行分割
        var _classNames = _tags[i].className.split(" ");
        // 遍历所有类名
        for (var j = 0, l = _classNames.length; j < l; j++) {
            if (_classNames[j] === className) { // 当前元素的某个类名与待查找的类名一致
                // 说明当前遍历到的元素是需要查找的元素之一
                _result.push(_tags[i]);
                break;
            }
        }
    }

    // 返回所有查找到的结果
    return _result;
}```
二、运用tools编写购物车
```


    
    
    


    
购物车
    

        

            
序号
            
标题
            
价格
            
数量
            
小计
            
操作
        
        

            
1
            
牛奶
            
59
            
-+
            
59
            
            
删除
        
        

            
2
            
蒙牛 纯牛奶 PURE MILK 250ml*16盒 礼盒装
            
35.1
            
-+
            
35.1
            
删除
        
        

            
3
            
科尔沁 休闲肉脯零食 内蒙古特产 手撕风干牛肉干孜然味400g
            
99
            
-+
            
99
            
删除
        
    
    
    结算
    
    

```