构建自己的JS框架

构建自己的JavaScript库:

创建一个IC.js文件

(function()){

     function $(){

          alert();

     }

     window['IC']={}

     window['IC']['$']=$;

})();

第二种,加入自己的方法:

(function(){
 window['IC']={}
 
 function $(){
  var elements = new Array();
  for(var i=0;i<arguments.length;i++){
   var element = arguments[i];
   
   if(typeof element == 'string'){
    element = document.getElementById(element);
   }
   
   if(arguments.length==1){
    return element;
   }
   elements.push(element);
  }
  return elements;
 }
 window['IC']['$']=$;
 
 function getElementsByClassName(className,tag){
  
  var allTags = document.getElementsByTagName(tag);
  var matchingElements = new Array();

  className = className.replace(/\-/g, "\\-");
  var regex = new RegExp("(^|\\s)" + className + "(\\s|$)");
  
  var element;

  for(var i=0; i<allTags.length; i++){
   element = allTags[i];
   if(regex.test(element.className)){
    matchingElements.push(element);
   }
  }
  

  return matchingElements;
  
 }
 
 window['IC']['getElementsByClassName']=getElementsByClassName;
})();

创建html页面,ICtest.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript" src="IC.js" ></script>
<script type="text/javascript" >
function testClick(){
 var testInput = IC.getElementsByClassName("testme","input");
 for(var i=0;i<testInput.length;i++){
  alert(testInput[i].value);
 }
 
}

</script>
</head>

<body >

<input type="text" value="test" class="testme" id="testId"/>
<input type="text" value="test3" class="testme" id="testId2"/>
<input type="button" value="clickme" onclick="testClick()"/>
</body>
</html>

原文地址:https://www.cnblogs.com/ZHF/p/1322484.html