模仿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 相关文章推荐
jquery插件如何使用 jQuery操作Cookie插件使用介绍
Dec 15 Javascript
用js替换除数字与逗号以外的所有字符的代码
Jun 07 Javascript
用jquery模仿的a的title属性的例子
Oct 22 Javascript
对Web开发中前端框架与前端类库的一些思考
Mar 27 Javascript
基于JavaScript将表单序列化类型的数据转化成对象的处理(允许对象中包含对象)
Dec 28 Javascript
在微信、支付宝、百度钱包实现点击返回按钮关闭当前页面和窗口的方法
Aug 05 Javascript
javascript深拷贝、浅拷贝和循环引用深入理解
May 27 Javascript
Vue三种常用传值示例(父传子、子传父、非父子)
Jul 24 Javascript
Vue CL3 配置路径别名详解
May 30 Javascript
基于jQuery的时间戳与日期间的转化
Jun 21 jQuery
JQuery通过键盘控制键盘按下与松开触发事件
Aug 07 jQuery
详解ES6中class的实现原理
Oct 03 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短域名转换为实际域名函数
2011/01/17 PHP
ThinkPHP分页实例
2014/10/15 PHP
Yii支持多域名cors原理的实现
2018/12/05 PHP
实例分析PHP将字符串转换成数字的方法
2019/01/27 PHP
Jquery知识点一 Jquery的ready和Dom的onload的区别
2011/01/15 Javascript
js判断IE6/IE7/FF的代码[XMLHttpRequest]
2011/02/16 Javascript
浅析Node在构建超媒体API中的作用
2014/07/30 Javascript
使用AOP改善javascript代码
2015/05/01 Javascript
js代码验证手机号码和电话号码是否合法
2015/07/30 Javascript
微信小程序开发之入门实例教程篇
2017/03/07 Javascript
BootStrap selectpicker后台动态绑定数据的方法
2017/07/28 Javascript
基于js 本地存储(详解)
2017/08/16 Javascript
HTML5+JS+JQuery+ECharts实现异步加载问题
2017/12/16 jQuery
JavaScript实现AOP详解(面向切面编程,装饰者模式)
2017/12/19 Javascript
vue项目实现表单登录页保存账号和密码到cookie功能
2018/08/31 Javascript
分享5个好用的javascript文件上传插件
2018/09/16 Javascript
JavaScript变速动画函数封装添加任意多个属性
2019/04/03 Javascript
vue-cli 项目打包完成后运行文件路径报错问题
2019/07/19 Javascript
Vue移动端用淘宝弹性布局lib-flexible插件做适配的方法
2020/05/26 Javascript
vue封装自定义指令之动态显示title操作(溢出显示,不溢出不显示)
2020/11/12 Javascript
[49:54]Ti4 循环赛第三日 LGD vs Titan
2014/07/12 DOTA
用Python实现一个简单的能够上传下载的HTTP服务器
2015/05/05 Python
python好玩的项目—色情图片识别代码分享
2017/11/07 Python
Python实现从log日志中提取ip的方法【正则提取】
2018/03/31 Python
美国最大的珠宝首饰网上商城:Jewelry.com
2016/07/22 全球购物
澳大利亚自然和有机的健康美容产品一站式商店:Ziani Beauty
2017/12/28 全球购物
牧马人澳大利亚官网:Wrangler澳大利亚
2019/10/08 全球购物
新加坡第一大健康与美容零售商:屈臣氏新加坡(Watsons Singapore)
2020/12/11 全球购物
职业教育毕业生求职信
2013/11/09 职场文书
门卫班长岗位职责
2013/12/15 职场文书
关于毕业的广播稿
2014/01/10 职场文书
高一数学教学反思
2014/02/07 职场文书
公司口号大全
2014/06/11 职场文书
催款函怎么写
2015/06/24 职场文书
解决mysql问题:由于找不到MSVCR120.dll,无法继续执行代码
2021/06/26 MySQL
Python中生成随机数据安全性、多功能性、用途和速度方面进行比较
2022/04/14 Python