通过编写自己的Javascript库来提高自己的Javascript水平.

今天先实现两个方法,以后边学习边编写.

(function (){
 window['SoftLin']={}
 //等同于document.getElementById()
 //实现了多叁数
 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['SoftLin']['$']=$;
 //获许指定标签下Class名
 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['SoftLin']['getElementsByClassName']=getElementsByClassName;
 //向DOM节点添加事件
 function addEvent(node,type,listener){
  if(!(node=$(node)))
   return false;
  if(node.addEventListener){
   node.addEventListener(type,listener,false);
   return true;
  }else if(node.attachEvent){
   node['e'+type+listener]=listener;
   node[type+listener]=function(){node['e'+type+listener](window.event);}
   node.attachEvent('on'+type,node[type+listener]);
   return true;
  }
  return false;
 };
 window['SoftLin']['addEvent']=addEvent;
 //向DOM节点后面添加节点
 function insertAfter(){
 }
 //删除多个子节点
 function removerChiildren(){
 }
 
 //将方法绑定到指定对象上
 function bindFunction(obj,func){
  return function(){
   func.apply(obj,arguments);
  } 
 }
 window['SoftLin']['bindFunction']=bindFunction;

//获取浏览器大小
 function getBrowserWindowSize(){
  var de=document.documentElement;
  return{
   'width':(
    window.innerWidth || (de && de.clientWidth) || document.body.clientWidth),
   'height':(
    window.innerHeight || (de && de.clientHeight) || document.body.clientHeight)   
  }
 };
 window['SoftLin']['getBrowserWindowSize']=getBrowserWindowSize;
 //nodeType常量 字面量方法定义
 window['SoftLin']['node']={
  ELEMENT_NODE:1,
  ATTRIBUTE_NODE:2,
  TEXT_NODE:3,
  CDATE_SECTION_NODE:4,
  ENTITY_REFERENCE_NODE:5,
  ENTITY_NODE:6,
  PROCESSING_INSTRUCTION_NODE:7,
  COMMENT_NODE:8,
  DOCUMENT_NODE:9,
  DOCUMENT_TYPE_NODE:10,
  DOCUMENT_FRAGMENT_NODE:11,
  NOTATION_NODE:12
 }
 //遍历节点
 function walkElementsLisner(func,node){
  var root=node||window.document;
  var nodes=root.getElementsByTagName('*');
  for(var i=0;i<nodes.length;i++){
   func.call(nodes[i]);
  }
 };
 window['SoftLin']['walkElementsLisner']=walkElementsLisner;

//返回节点的深度
 function walkTheDOMRecursive(func,node,depth,returnFromParent){
  var root=node||window.document; 
  var returnFromParent=func.call(node,depth++,returnFromParent);
  var node=root.firstChild;
  while(node){
   walkTheDOMRecursive(func,node,depth,returnFromParent);
   node=node.nextSibling;
  }
 };
 window['SoftLin']['walkTheDOMRecursive']=walkTheDOMRecursive;
 //遍历节点的属性
 function walkTheDOMWithAttirubutes(node,func,depth,returnFromParent){
  var root=node||window.document;
  returnFromParent=func.call(root,depth++,returnFromParent);
  if(root.attributes){
   for(var i=0;i<root.attributes.length;i++){
    walkTheDOMWithAttirubutes(root.attributes[i],func,depth-1,returnFromParent); 
   
   }
  }
  if(root.nodeType!=SoftLin.node.ATTRIBUTE_NODE){
   node=root.firstChild;
   while(node){
    walkTheDOMWithAttirubutes(node,func,depth,returnFromParent);
    node=node.nextSibling;
   }
  }
 }
 window['SoftLin']['walkTheDOMWithAttirubutes']=walkTheDOMWithAttirubutes;
 
})();

                2010年8月31日2点16分

转载于:https://www.cnblogs.com/softlin/archive/2010/08/31/1813263.html

编写自己的Javascript库-1相关推荐

  1. [Javascript_库编写]创建自己的“JavaScript库”

    一.编写JavaScript库要注意的问题   为了让自己的JS库构建的更加优雅.合理,我们编写JS库时要注意两方面的内容: 1.不要使用版本检测,而要使用能力检测 由于浏览器的类型和版本太多,以及不 ...

  2. JavaScript库和API

    by Adam Recvlohe 通过亚当·雷夫洛厄(Adam Recvlohe) API就像一盒巧克力 (APIs are like a box of chocolates) If you have ...

  3. jQuery JavaScript库达到新的里程碑

    一.什么是JQuery? Jquery是继prototype之后又一个优秀的Javascript框架.它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器(IE 6.0+, FF 1.5+, Saf ...

  4. 活学活用流行的JavaScript库——《JavaScript实战》

    媒体评论 "本书并不像一本教材,畅读之后,你会觉得它就是一位讲课生动的老师,带领你遨游 JavaScript 海洋,把你推向技术风浪的前沿,同时又给了你一个功能完备的冲浪板,接下来就是你在风 ...

  5. 参考: 40个轻量级 JavaScript 库

    流行的 JavaScript 库不胜枚举,jQuery, MooTools, Prototype, Dojo, YUI.这些 JavaScript 库功能丰富,加上它们的插件,几乎能胜任任何工作,然而 ...

  6. 推荐11个实用的JavaScript库

    作者 | Jonathan Saring 编辑 | 无明 JavaScript 仍然是 2018 年最受欢迎和使用最为广泛的编程语言,因此 JavaScript 生态系统也会继续发展壮大. 然而,Ja ...

  7. [译] 2018 年七个通过脑电图分析实现“读心术”的 Javascript 库

    原文地址:7 Javascript EEG Mind Reading Libraries for 2018 原文作者:Gilad Shoham 译文出自:掘金翻译计划 本文永久链接:github.co ...

  8. 优雅的创建一个JavaScript库

    这篇文章的目的是通过演示一个简单的例子来介绍在JS中实例化和定义一个库的正确方法,以优化他人编写或维护自己的JS库. 在我们深入之前,我做了两点假设: 你知道简单的JavaScript或C语言. 你不 ...

  9. 深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点

    才华横溢的Stoyan Stefanov,在他写的由O'Reilly初版的新书<JavaScript Patterns>(JavaScript模式)中,我想要是为我们的读者贡献其摘要,那会 ...

最新文章

  1. UI设计培训之如何将设计理论与实践相结合
  2. 深度优先搜索(dfs),城堡问题
  3. Python 类的属性与实例属性
  4. 深蓝学院《从零开始手写VIO》作业一
  5. SAP调用WSDL报错,求解!
  6. python秒数转化为时间用户jianpang_Python中文转为拼音
  7. PROC系列之/proc/stat/
  8. 你一定要知道的关于Linux文件目录操作的12个常用命令
  9. PHP的查找stripos strpos strripos strpos
  10. LightOJ 1058 平行四边形的判断定理
  11. PMP第六版 十五至尊图
  12. 动图怎么分解成静图?教你一键在线分解gif动图?
  13. 不超过 20 行,搞定关键词屏蔽功能!
  14. 计算机网络辅助英语写作,基于计算机网络的英语写作教学
  15. 33张你没看过的酷炫化学动图, 秒懂化学反应原理!
  16. Python 爬取百度音乐
  17. RAC环境中部署OGG,并使用集群管理OGG资源
  18. Linux下__attribute__((aligned(n)))的使用
  19. SpringBoot实现微信小程序登录功能
  20. UGUI中随意调整Text中的字体间距

热门文章

  1. axure 素材_Axure原型:超漂亮的系统首页
  2. oracle10g密钥,Oracle10G透明数据加密技术如何使用呢?
  3. python关系图谱_文本分析之制作网络关系图
  4. 转json_Java对象转JSON时如何动态的增删改查属性
  5. 2020年7月编程语言排行榜
  6. 找一份好工作真的很难?是的,很难。
  7. 天骄2 mysql错误_凤舞天骄一键版和钟隐3合1版的大多数问题解决方案
  8. lrange是取出所有值并移除么_美欧日站点亚马逊物流库存绩效指标分数达标值将降低为 450...
  9. 软件测试与开发专业就业方向,学习软件测试后就业方向有哪些?
  10. android弹窗不能手动关闭_vue3.0系列:Vue3自定义PC端弹窗组件V3Layer