仿(用原生js封裝jQuery庫——$、選擇器)


function JQuery(arg){
  //存對象
  this.elements=[];
  switch(typeof arg){
    case 'string':
      this.elements=getEle(arg);
      this.length=this.elements.length;
    break;
    case 'function':
      window.onload=arg;
    break;
    default:
      this.elements.push(arg);
    break;
  }
}

function $(arg){
  return new JQuery(arg);
}

function getEle(str){
  //切成 #box,ul,li,input
  var arr=str.split(' ');
  //父級
  var aParent=[document];
  //子級
  var aChild=[];
  for(var i=0; i<arr.length; i++){
    //給aChild賦值
    aChild=getByStr(aParent,arr[i]);
    //給aParent賦值,選取下一次的子級
    aParent=aChild;
  }
  return aChild;
}

function getByStr(aParent,str){
  //aParent:第一次document
  //str:第一次 #box
  var aChild=[];
  for(var i=0; i<aParent.length; i++){
    //判斷是哪一類選擇器
    switch(str.charAt(0)){
      case '#':
        var obj=document.getElementById(str.substring(1));
        aChild.push(obj);
      break;
      case '.':
        var aEle=getByClass(aParent[i],str.substring(1));
        for(var j=0; j<aEle.length; j++){
          aChild.push(aEle[j]);
        }
      break;
      default:
        //li.on
        if(/^\w+\.\w+$/.test(str)){
          var arr=str.split('.');
          var aEle=aParent[i].getElementsByTagName('*');
          var re=new RegExp('\\b'+arr[1]+'\\b');
          for(var j=0; j<aEle.length; j++){
            if(aEle[j].className.search(re)!=-1){
              aChild.push(aEle[j]);
            }
          }
        }else if(/\w+\[\w+\=\w+\]/.test(str)){
          //input[type=button]
          var arr=str.split(/\[|\=|\]/g);
          var aEle=aParent[i].getElementsByTagName(arr[0]);
          for(var j=0; j<aEle.length; j++){
            if(aEle[j].getAttribute(arr[1])==arr[2]){
              aChild.push(aEle[j]);
            }
          }
        }else if(/\w+\:\w+(\(\d+\))?/.test(str)){
          //li:eq(0);
          var arr=str.split(/\:|\(|\)/g);
          var aEle=aParent[i].getElementsByTagName(arr[0]);
          switch(arr[1]){
            case 'first':
              aChild.push(aEle[0]);
            break;
            case 'last':
              aChild.push(aEle[aEle.length-1]);
            break;
            case 'even':
              for(var j=0; j<aEle.length; j+=2){
                aChild.push(aEle[j]);
              }
            break;
            case 'odd':
              for(var j=1; j<aEle.length; j+=2){
                aChild.push(aEle[j]);
              }
            break;
            case 'eq':
              aChild.push(aEle[arr[2]]);
            break;
            case 'lt':
              for(var j=0; j<arr[2]; j++){
                aChild.push(aEle[j]);
              }
            break;
            case 'gt':
              for(var j=(parseInt(arr[2])+1); j<aEle.length; j++){
                aChild.push(aEle[j]);
              }
            break;
          }
        }else{
          var aEle=aParent[i].getElementsByTagName(str);
          for(var j=0; j<aEle.length; j++){
            aChild.push(aEle[j]);
          }
        }
      break;
    }
  }
  return aChild;
}

function getByClass(obj,sClass){
  if(obj.getElementsByClassName){
    return obj.getElementsByClassName(sClass);
  }
  var aResult=[];
  var aEle=obj.getElementsByTagName('*');
  var re=new RegExp('\\b'+sClass+'\\b');
  for(var i=0; i<aEle.length; i++){
    if(aEle[i].className.search(re)!=-1){
      aResult.push(aEle[i]);
    }
  }
  return aResult;
}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM