具体如下:

//w作为window的形参,就表示window
(function(w) { // 定义一个全局的window.wyl变量,就类似于jquery里的$,Jquery对象
w.wyl;
/**
* 模仿$(domObj)的形式,通过wyl(domObj)的方式把一个dom转成wyl对象
*
* @param para
* @returns {wyl} 这里的selector暂时只能是dom对象
*/
wyl = function(selector) {
this._selector = selector;
if (this == window) {
// 我自己原来写的
// return this.wyl;
return new wyl(selector);
} else {
// 用来保存选中的元素
this.elements = []; // 判断selector的类型,因为jquery(xxx)中的xxx总共有三种类型,1 function ,2 字符串 ,如
// '#aa','.my'等等 ; 3 dom对象也就是object switch (typeof selector) {
case 'function':
this.wylAddEvent(w, 'load', selector);
break;
// 模拟 #xx选择器
case 'string':
switch (selector.charAt(0)) {
case '#':// 按照id选择器
var obj = document.getElementById(selector.substring(1));
this.elements.push(obj);
break;
case '.':// 按照class选择器
this.elements = getEleByClas(document, selector
.substring(1));
break;
default: // 按照tagName
this.elements = document.getElementsByTagName(selector);
}
break;
case 'object':
this.elements.push(selector);
break;
default:
break;
} // 根据name获取dom
/* var dom_ = document.getElementsByName('' + selector); */
/**
* 根据 document.getElementsByName('' +selector);的形式获取到的dom对象
* 有length属性,而通过getElementById获取的dom对象没有length属性
*
*/
/*
* if (dom_.length) { alert(dom_.length); } else {
* alert(dom_.innerHTML + '目前这个框架只能通过传入name属性来使用,无法通过id来解析dom对象'); }
*/ // 作用:返回当前对象,即返回window.wyl这个对象
// return this;
var this_ = [].push.apply(this, this.elements);
// 注意这里返回的不是this_而是this
return this;
} }
// 根据class进行选择,即模拟class选择器
wyl.getEleByClas = function(oParent, sClass) {
var aEle = document.getElementsByTagName("*");
var aResults = [];
for (i = 0; i < aEle.length; i++) {
if (aEle[i].className == sClass) {
aResults.push(aEle[i]);
}
}
return aResults;
} wyl.prototype.wylAddEvent = wyl.wylAddEvent = function(obj, sEv, fn) {
if (obj.attachEvent) {
obj.attachEvent('on' + sEv, fn);
} else {
obj.addEventListener(sEv, fn, false);
}
} // wyl.prototype.isArr的作用:在所有的wyl对象上加上isArr(para)的function,
wyl.prototype.isArr = wyl.isArr = function(para) {
/**
* 在wyl对象上添加工具方法isArr(obj) 实例:var flag = wyl.isArr(obj); 如果为true那么就说明是数组
*/
if (typeof para == 'object' && para instanceof Array) {
return true;
} else {
return false;
}
} /**
* 实现类似框架中的linkbutton()功能的方法 框架中的使用实例: $obj.linkbutton({ disabled:true });
*
*/
wyl.prototype.print = wyl.print = function(para) {
alert(para);
return this;
} wyl.prototype.linkbutton = wyl.linkbutton = function(para) {
var _type = typeof para;
if (_type != 'object') {
return this.print('传入的参数必须是object');
}
// 存放传入的obejct类型的参数
var para_ = para || {};
var f = para_.disabled;
if (f == true) {
$(this).removeClass();
$(this).addClass('l-btn-disabled');
return this;
} else {
$(this).removeClass();
$(this).addClass('l-btn-abled');
return this;
}
} // 传入window对象
})(window)

  

模仿jquery的一些实现 第二版的更多相关文章

  1. 锋利的jQuery(第二版)学习总结

    通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结. 此书主要讲解了jQuery的常用操作,包括认识jQuery,j ...

  2. 《锋利的jQuery 第二版》chapter 1~

    chapter 1 认识 jQuery jquery.js(开发版),jquery.min.js(生产版) window.onload 与 $(document).ready() 的对比: jquer ...

  3. GRIDDATA(表格)第二版

    JQUERY 插件开发——GRIDDATA(表格)第二版 开发背景 表格插件之前我也写个一篇,当时写那个插件的时候,我自己还没有总结出写插件的方法,虽然功能实现了,但是使用起来还是有点别扭的,并且需要 ...

  4. 读书笔记:JavaScript DOM 编程艺术(第二版)

    读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...

  5. Lucene.net站内搜索—6、站内搜索第二版

    目录 Lucene.net站内搜索—1.SEO优化 Lucene.net站内搜索—2.Lucene.Net简介和分词Lucene.net站内搜索—3.最简单搜索引擎代码Lucene.net站内搜索—4 ...

  6. 《代码大全(第二版)》【PDF】下载

    <代码大全(第二版)>[PDF]下载链接: https://u253469.pipipan.com/fs/253469-230382264 内容简介 <代码大全(第2版)>是著 ...

  7. 《selenium2 Java 自动化测试实战(第二版)》 更新2016.5.3

    java 版来了!! 本文档在<selenium2 Python 自动化测试实战>的基础上,将代码与实例替换为java ,当然,部分章节有变更.这主要更语言本身的特点有关.集合和java下 ...

  8. 《Java程序设计与数据结构教程(第二版)》学习指导

    <Java程序设计与数据结构教程(第二版)>学习指导 欢迎关注"rocedu"微信公众号(手机上长按二维码) 做中教,做中学,实践中共同进步! 原文地址:http:// ...

  9. (转载)持续集成(第二版)[来自:Martin Fowler]

    转载自:iTech的博客 持续集成(第二版) 作者:Martin Fowler 译者:雷镇 持续集成 是一种软件开发实践.在持续集成中,团队成员频繁集成他们的工作成果,一般每人每天至少集成一次,也可以 ...

随机推荐

  1. 走进Groovy (二)

    承接上一篇,配置好环境后,开始正式学习语法.我假设看此文的同学至少会一定的JAVA语法,因此一些太过基础的就不记录了,基本上,大家看看示例就明白了. Groovy的卖点之一,就是全兼容JAVA的语法, ...

  2. Dijkstra算法模拟讲解

    dijkstra算法,是一个求单源最短路径算法 其算法的特点为: 层层逼进,有点类似宽度搜索的感觉 其需要的数据结构为:                  int map[N][N] 所有点之间的权表 ...

  3. Android实现获取应用程序相关信息列表的方法

    本文所述为Androdi获取手机应用列表的方法,比如获取到Android应用的软件属性.大小和应用程序路径.应用名称等,获取所有已安装的Android应用列表,包括那些卸载了的,但没有清除数据的应用程 ...

  4. Extjs4 类的定义和扩展

    一般定义方式,注意方法和函数的添加方式不同.(添加函数只能用override方式添加不知为什么,有知道的,请搞之.) 定义一个类,并给他一个方法 1: Ext.define('Simple.Class ...

  5. Android应用开发基础篇(4)-----TabHost(选项卡)

    一.概述 TabHost是一种用来显示标签的组件,不清楚?看一下来电通这个应用就知道了.这个组件用起来与其他组件不太一样,它需要继承TabActivity这个类,还有它的布局文件与我们平时用的也有些不 ...

  6. Activity切换动画(overridePendingTransition)-翻页效果

    Activity的切换动画指的是从一个activity跳转到另外一个activity时的动画.{它包括两个部分:一部分是第一个activity退出时的动画:另外一部分时第二个activity进入时的动 ...

  7. sql 月初和月末

    --月初 select  convert(varchar(10),dateadd(day,-(day(getdate()) -1),getdate()) ,120) --月末select  conve ...

  8. iOS实践02

    第二天了,上了一天课,软件测试.数据挖掘.概率论,晚上了才有时间捣鼓捣鼓程序. 今天只是简单的做了一点.觉得自己思考的写不出来,只能简单的写一个过程,不像第一次写这个,少了很多思考的. 1.完善tab ...

  9. 200常用JS

    .文本框焦点问题 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产生该事件 Onselect:当文字加亮后,产生该文件 &l ...

  10. 关于input标签的需要注意的几个小问题

    1.input元素没有结束标签,只有开始标签,即使写上结束标签也不起作用.如下 <input type="text" value="text" /> ...