模仿jQuery each函数的链式调用


Posted in Javascript onJuly 22, 2009
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<title>Each Document</title> 
<script type="text/javascript"> 
(function(){ //创建一个自执行函数 
function _$(el){ //声明一个类 
this.elements = []; //用于保存DOM元素的引用 
for (var i = 0; i < el.length; i++) { 
var element = el[i]; 
if (typeof element == string ) { 
element = document.getElementById(element); 
} 
this.elements.push(element); 
} 
} _$.prototype = { 
each: function(fn){ 
for (var i = 0; i < this.elements.length; i++) { 
fn.call(this, this.elements[i]); //第二个参数是fn函数的参数 
} 
}, 
setStyle: function(prop, val){ 
var that = this; 
this.each(function(el){ //注意参数的设置 
el.style[prop] = val; 
}); 
return this; 
} 
} 
window.$ = function(){ 
return new _$(arguments); 
}; 
})(); 
window.onload = function(){ 
$("p", "p2").setStyle("color", "red"); 
} 
</script> 
</head> 
<body> 
<p id="p"> 
Hello world 
</p> 
<p id="p2"> 
Welcome. 
</p> 
</body> 
</html>
Javascript 相关文章推荐
Javascript Global对象
Aug 13 Javascript
jQuery简单tab切换效果实现方法
Apr 08 Javascript
javascript表单验证大全
Aug 12 Javascript
初步了解javascript面向对象
Nov 09 Javascript
如何用JS/HTML将时间戳转换为“xx天前”的形式
Feb 06 Javascript
原生js实现简单的模态框示例
Sep 08 Javascript
Vue刷新修改页面中数据的方法
Sep 16 Javascript
Fetch超时设置与终止请求详解
May 18 Javascript
详解ECMAScript2019/ES10新属性
Dec 06 Javascript
Openlayers显示地理位置坐标的方法
Sep 28 Javascript
微信小程序入门之指南针
Oct 22 Javascript
JavaScript中常用的3种弹出提示框(alert、confirm、prompt)
Nov 10 Javascript
js 代码集(学习js的朋友可以看下)
Jul 22 #Javascript
javascript Base类 包含基本的方法
Jul 22 #Javascript
javascript 表单规则集合对象
Jul 21 #Javascript
一个可以随意添加多个序列的tag函数
Jul 21 #Javascript
一个cssQuery对象 javascript脚本实现代码
Jul 21 #Javascript
js计算页面刷新的次数
Jul 20 #Javascript
[原创]IE view-source 无法查看看源码 JavaScript看网页源码
Jul 19 #Javascript
You might like
discuz安全提问算法
2007/06/06 PHP
php动态实现表格跨行跨列实现代码
2012/11/06 PHP
php取整函数ceil,floo,round的用法及介绍
2013/08/31 PHP
PHP整数取余返回负数的相关解决方法
2014/05/15 PHP
微信公众平台开发教程③ PHP实现微信公众号支付功能图文详解
2019/04/10 PHP
表单元素的submit()方法和onsubmit事件应用概述
2013/02/01 Javascript
javascript关于运动的各种问题经典总结
2015/04/27 Javascript
jQuery的基本概念与高级编程
2015/05/14 Javascript
JavaScript中判断两个字符串是否相等的方法
2015/07/07 Javascript
详解为Bootstrap Modal添加拖拽的方法
2018/01/05 Javascript
Node.js 使用AngularJS的方法示例
2018/05/11 Javascript
angular6 填坑之sdk的方法
2018/12/27 Javascript
详解mpvue中小程序自定义导航组件开发指南
2019/02/11 Javascript
react组件基本用法示例小结
2020/04/27 Javascript
[02:05]2014DOTA2西雅图邀请赛 老队长全明星大猜想谁不服就按进显示器
2014/07/08 DOTA
[01:07:19]DOTA2-DPC中国联赛 正赛 CDEC vs XG BO3 第一场 1月19日
2021/03/11 DOTA
全面分析Python的优点和缺点
2018/02/07 Python
python实现excel读写数据
2021/03/02 Python
Python实现将HTML转成PDF的方法分析
2019/05/04 Python
python实现海螺图片的方法示例
2019/05/12 Python
python 装饰器功能与用法案例详解
2020/03/06 Python
python从PDF中提取数据的示例
2020/10/30 Python
Python-openpyxl表格读取写入的案例详解
2020/11/02 Python
Django restful framework生成API文档过程详解
2020/11/12 Python
python爬虫scrapy框架的梨视频案例解析
2021/02/20 Python
美国学校校服,儿童和婴儿服装:Cookie’s Kids
2016/10/14 全球购物
美国最大的高尔夫发球时间预订网站:TeeOff.com
2018/03/28 全球购物
澳大利亚家具商店:Freedom
2020/12/17 全球购物
Ejb技术面试题
2015/04/29 面试题
应届生保险求职信
2013/11/11 职场文书
小学门卫岗位职责
2013/12/17 职场文书
中英文自我评价常用句型
2013/12/19 职场文书
体育教师自我鉴定
2014/02/12 职场文书
品牌宣传方案
2014/03/21 职场文书
研究生毕业自我鉴定范文
2014/03/27 职场文书
员工工作心得体会
2019/05/07 职场文书