模仿jquery的一些实现 第二版
具体如下:
//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的一些实现 第二版的更多相关文章
- 锋利的jQuery(第二版)学习总结
通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结. 此书主要讲解了jQuery的常用操作,包括认识jQuery,j ...
- 《锋利的jQuery 第二版》chapter 1~
chapter 1 认识 jQuery jquery.js(开发版),jquery.min.js(生产版) window.onload 与 $(document).ready() 的对比: jquer ...
- GRIDDATA(表格)第二版
JQUERY 插件开发——GRIDDATA(表格)第二版 开发背景 表格插件之前我也写个一篇,当时写那个插件的时候,我自己还没有总结出写插件的方法,虽然功能实现了,但是使用起来还是有点别扭的,并且需要 ...
- 读书笔记:JavaScript DOM 编程艺术(第二版)
读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...
- Lucene.net站内搜索—6、站内搜索第二版
目录 Lucene.net站内搜索—1.SEO优化 Lucene.net站内搜索—2.Lucene.Net简介和分词Lucene.net站内搜索—3.最简单搜索引擎代码Lucene.net站内搜索—4 ...
- 《代码大全(第二版)》【PDF】下载
<代码大全(第二版)>[PDF]下载链接: https://u253469.pipipan.com/fs/253469-230382264 内容简介 <代码大全(第2版)>是著 ...
- 《selenium2 Java 自动化测试实战(第二版)》 更新2016.5.3
java 版来了!! 本文档在<selenium2 Python 自动化测试实战>的基础上,将代码与实例替换为java ,当然,部分章节有变更.这主要更语言本身的特点有关.集合和java下 ...
- 《Java程序设计与数据结构教程(第二版)》学习指导
<Java程序设计与数据结构教程(第二版)>学习指导 欢迎关注"rocedu"微信公众号(手机上长按二维码) 做中教,做中学,实践中共同进步! 原文地址:http:// ...
- (转载)持续集成(第二版)[来自:Martin Fowler]
转载自:iTech的博客 持续集成(第二版) 作者:Martin Fowler 译者:雷镇 持续集成 是一种软件开发实践.在持续集成中,团队成员频繁集成他们的工作成果,一般每人每天至少集成一次,也可以 ...
随机推荐
- android ListView的上部下拉刷新下部点击加载更多具体实现及拓展
android ListView的上部下拉刷新下部点击加载更多具体实现及拓展 ListView下拉刷新,上拉自动加载更多 下拉刷新以及加载更多
- BZOJ 2253: [2010 Beijing wc]纸箱堆叠
题目 2253: [2010 Beijing wc]纸箱堆叠 Time Limit: 30 Sec Memory Limit: 256 MBSubmit: 239 Solved: 94 Descr ...
- FastCGI | FastCGI -
FastCGI | FastCGI - FastCGI About FastCGI FastCGI is simple because it is actually CGI with only a f ...
- Java图形化界面设计——容器(JFrame)
Java图形化界面设计——容器(JFrame) 程序是为了方便用户使用的,因此实现图形化界面的程序编写是所有编程语言发展的必然趋势,在命令提示符下运行的程序可以让我们了解java程序的基本知识体系结构 ...
- UI基础:UILabel.UIFont
UILabel:标签 继承自UIView ,在UIView基础上扩充了显示文本的功能.(文本框) UILabel的使用步骤 1.创建控件 UILabel *aLabel=[[UILabel alloc ...
- 【iOS-Android开发对照】之 数据存储
[iOS-Android开发对照]之 数据存储 写在前面的话 相比Android和iOS,我认为Android的数据存储更开放一些.Android天生就能够使用多Java I/O:并且天生开放的特性, ...
- 自己定义控件-GifView
一.描写叙述 显示Gif 的View 原理是用 MediaPlayer 实现的 二.源代码 https://github.com/mentor811/Demo_GifView [ 声明:版权全部,欢迎 ...
- Nice way for strip_tags a like
I found this code works great as the function strip_tags in php to replace html tags from string and ...
- 笔记-Nodejs中的核心API之Events
最近正在学习Node,在图书馆借了基本关于Node的书,同时在网上查阅资料,颇有收获,但是整体感觉对Node的理解还是停留在一个很模棱两可的状态.比如Node中的模块,平时练习就接触到那么几个,其他的 ...
- 【SVN】使用花生壳映射VisualSVN外网地址
内网端口设置为443,花生壳映射设置的时候不能使用80端口,,需要用其他端口,,