lkmusic项目之（基础函数搭建一）

代码（因为使用到了最新的html5 api 所以不兼容低版本ie和其它一些不支持classList DOMList接口的现代浏览器）

//基于smusic开源代码进行修改和加强
(function(win){
  //此音乐库采用全新的html5 api来对样式的增删改查进行操作 ie版本需要10.0以上 使用此音乐类库请特别注意低版本ie 已不再我的兼容列表里面
  //至于为什么使用classList这个新的api 请参见张兴旭的一篇文章 http://www.zhangxinxu.com/wordpress/2013/07/domtokenlist-html5-dom-classlist-%E7%B1%BB%E5%90%8D/
  //修正一下 实现了操作元素样式的操作类classList默认使用原生支持的api 否则使用模拟的api来进行实现
  function classList(e){
    if(e.classList){
        //这里需要对classList的原生api进行一下加强
        /*
        DOMTokenList.prototype.adds = function(tokens){
            tokens.split(' ').forEach(function(token){
                 this.add(token);
            });
            return this;
        };*/
        return e.classList;
    }//如果原生支持classList这个api那么直接返回
    else return new CSSClassList(e);//否则就伪造一个
  }
  //CSSClassList 是一个模拟DOMTokenList的javascript类
  function CSSClassList(e){
    this.e = e;
  }
  //如果e.className 包含类名c则返回true；否则返回false
  CSSClassList.prototype.contains=function(c){
      if(c.length ===0 || c.indexOf(' ')!==-1){
        throw new Error("invalid class name: '"+c+"'");
      }
      //首先是常规检查
      var classes = this.e.className;
      if(!classes) return false;//e不含类名
      if(classes === c) return true;//e有一个完全匹配的类名
      //否则，把c自身看成一个单词,利用正则表达式搜索
      //\b在正则表达式里面代表单词的边界
      return classes.search('\\b'+c+'\\b') !== -1;
  };
  //如果c不存在，将c添加到e.className中
  CSSClassList.prototype.add = function(c){
    if(this.contains(c)) return;//如果存在就直接返回 不需要再新增一个
    var classes = this.e.className;
    if(classes && classes[classes.length-1] !== ' '){
        c = ' '+c;//如果没有空格需要加上一个空格
    }
    this.e.className +=c;
  };
  //将在e.className中出现的c全部删除
  CSSClassList.prototype.remove =function(c){
    if(!this.contains(c))return;//如果类里面本来就没有就直接返回
    //将所有作为单词的c和多余的尾随空格全部删除
    var pattern = new RegExp('\\b'+c+'\\b\\s*','g');
    this.e.className = this.e.className.replace(pattern,'');
  };
  //如果c不存在，将c添加到e.className中，并且返回true
  //如果c存在，那么将在e.className中出现的所有c都删除，并返回false
  CSSClassList.prototype.toggle=function(c){
     if(this.contains(c)){//如果e.className 包含c
        this.remove(c); //删除它
        return false;
     }else{
        //否则的话
        this.add(c);//否则就添加c
        return true;
     }
  };
  //返回 e.className本身
  CSSClassList.prototype.toString = function(){
    return this.e.className;
  };
  //返回e.className 中的类名 是一个数组
  CSSClassList.prototype.toArray = function(){
    return this.e.className.match(/\b\w+\b/g) || [];
  }

  //实现链式调用
  function $(query){
     return document.querySelector(query);
  }
  //实现基本拓展
  function extend(o,p){
    for(prop in p){
        o[prop] = p[prop];
    }
    return o;
  }
  //实现计算时间
  function calctime(time){
        var hours,minutes,seconds,timer='';
        hours = String(parseInt(time / 3600));
        minutes = String(parseInt((time % 3600)/60));
        seconds = String(parseInt((time % 60)));
        if(hours !== '0'){
            if(hours.length === 1) hours ='0'+hours;
            timer+=(hours+':');
        }
        if(minutes.length === 1 ){
            minutes ='0'+minutes;
        }
        timer+=(minutes+":");
        if(seconds.length === 1){
             seconds = '0'+seconds;
        }
        timer+=seconds;
        return timer;
  }
  //var cover =classList($('.u-cover')).remove('u-cover'); //测试代码
  //实现兼容各个浏览器的XMLHttpRequest
  if(win.XMLHttpRequest === undefined){
     win.XMLHttpRequest = function(){
        try{
             return new ActiveXObject('Msxml2.XMLHTTP.6.0');
        }catch(e1){
             try{
                return new ActiveXObject('Msxml2.XMLHTTP.3.0');
             }catch(e2){
                //否则就出错了
                throw new Error('XMLHttpRequset is not supported!');
             }
        }
     };
  }
  //实现简单的ajax操作
  function ajax(url,type,isasync,callback){
      if(!url) return false;
      if(!type) type = 'GET';
      if(!isasync) isasync = false;
      if(!callback) callback = function(result){
              console.log(result);
      }
      var xhr = new XMLHttpRequest();
      xhr.open(type,url,isasync);//这里要注意是否异步，如果是true那就是异步调用不会卡死浏览器
      xhr.onreadystatechange = function(){
             if(xhr.readyState === 4 && xhr.status=== 200){
                 var type = xhr.getResponseHeader('Content-Type');
                 //检查类型
                 if(type.indexOf('xml') !== -1 && xhr.responseXML) callback(xhr.responseXML);//返回xml
                 else if(type === 'application/json')
                 callback(JSON.parse(xhr.responseText));  //如果是json那么就对json数据进行编码操作
                 else
                 //直接返回字符串响应
                 callback(xhr.responseText);
             }
      };
      xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");//让服务器判断是ajax请求还是属于普通请求
      xhr.send(null);//发送请求
  }
  //ajax('http://localhost:808/smusicmyversion/index.html'); 测试代码
})(window);