模仿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 相关文章推荐
JS类库Bindows1.3中的内存释放方式分析
Mar 08 Javascript
JavaScript 编程引入命名空间的方法与代码
Aug 13 Javascript
javascript网页关闭时提醒效果脚本
Oct 22 Javascript
jquery+json实现数据二级联动的方法
Nov 28 Javascript
Angular.js中用ng-repeat-start实现自定义显示
Oct 18 Javascript
JavaScript使用正则表达式获取全部分组内容的方法示例
Jan 17 Javascript
JS实现JSON.stringify的实例代码讲解
Feb 07 Javascript
Bootstrap笔记之缩略图、警告框实例详解
Mar 09 Javascript
VS Code转换大小写、修改选中文字或代码颜色的方法
Dec 15 Javascript
JavaScript中使用import 和require打包后实现原理分析
Mar 07 Javascript
vue如何在自定义组件中使用v-model
May 14 Javascript
JS实现同一DOM元素上onClick事件与onDblClick事件并存的解决方法
Jun 07 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
php的array数组和使用实例简明教程(容易理解)
2014/03/20 PHP
php截取指定2个字符之间字符串的方法
2015/04/15 PHP
laravel 获取当前url的别名方法
2019/10/11 PHP
理解Javascript_14_函数形式参数与arguments
2010/10/20 Javascript
多种方法实现JS动态添加事件
2013/11/01 Javascript
JS中类或对象的定义说明
2014/03/10 Javascript
js识别不同浏览器基于userAgent做判断
2014/07/29 Javascript
浅谈Node.js中的定时器
2015/06/18 Javascript
jQuery模仿阿里云购买服务器选择购买时间长度的代码
2016/04/29 Javascript
第六篇Bootstrap表格样式介绍
2016/06/21 Javascript
switch语句的妙用(必看篇)
2016/10/03 Javascript
jquery获取easyui日期控件的值实现方法
2016/11/09 Javascript
Bootstrap CSS布局之代码
2016/12/17 Javascript
canvas绘制表盘时钟
2017/01/23 Javascript
JavaScript实现的简单加密解密操作示例
2018/06/01 Javascript
vue axios 简单封装以及思考
2018/10/09 Javascript
Python 流程控制实例代码
2009/09/25 Python
Python中的类学习笔记
2014/09/23 Python
Python 专题四 文件基础知识
2017/03/20 Python
python中将字典形式的数据循环插入Excel
2018/01/16 Python
python遍历一个目录,输出所有的文件名的实例
2018/04/23 Python
用TensorFlow实现戴明回归算法的示例
2018/05/02 Python
对python sklearn one-hot编码详解
2018/07/10 Python
Django 全局的static和templates的使用详解
2019/07/19 Python
Django打印出在数据库中执行的语句问题
2019/07/25 Python
Python存储读取HDF5文件代码解析
2020/11/25 Python
在Pycharm中安装Pandas库方法(简单易懂)
2021/02/20 Python
html5 touch事件实现页面上下滑动效果【附代码】
2016/03/10 HTML / CSS
HTML5拖放功能_动力节点Java学院整理
2017/07/13 HTML / CSS
德国大型和小型家用电器网上商店:Energeto
2019/05/15 全球购物
蔻驰英国官网:COACH英国
2020/07/19 全球购物
平面网站制作专科生的自我评价分享
2013/12/11 职场文书
开办饭店创业计划书
2013/12/28 职场文书
房屋买卖协议书范本
2014/04/10 职场文书
门面房租房协议书
2014/12/01 职场文书
宾馆前台接待岗位职责
2015/04/02 职场文书