模仿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 new 需不需要继续使用
Jul 02 Javascript
关于setInterval、setTimeout在jQuery中的使用注意事项
Sep 28 Javascript
javascript使用onclick事件改变选中行的颜色
Dec 30 Javascript
充分发挥Node.js程序性能的一些方法介绍
Jun 23 Javascript
jQuery无刷新切换主题皮肤实例讲解
Oct 21 Javascript
js获取客户端操作系统类型的方法【测试可用】
May 27 Javascript
JavaScript中利用for循环遍历数组
Jan 15 Javascript
jQuery中ztree 点击文本框弹出下拉框的实例代码
Feb 05 Javascript
微信小程序定位当前城市的方法
Jul 19 Javascript
原生JS实现的简单轮播图功能【适合新手】
Aug 17 Javascript
详解vue中async-await的使用误区
Dec 05 Javascript
vue制作toast组件npm包示例代码
Oct 29 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数组编码转换示例详解
2014/03/11 PHP
Parse正式发布开源PHP SDK
2014/08/11 PHP
smarty模板引擎从php中获取数据的方法
2015/01/22 PHP
解析arp病毒背后利用的Javascript技术附解密方法
2007/08/06 Javascript
JavaScript URL参数读取改进版
2009/01/16 Javascript
cnblogs TagCloud基于jquery的实现代码
2010/06/11 Javascript
小试JQuery的AutoComplete插件
2011/05/04 Javascript
jQuery内容折叠效果插件用法实例分析(附demo源码)
2016/04/28 Javascript
JS键盘版计算器的制作方法
2016/12/03 Javascript
详谈Angular路由与Nodejs路由的区别
2017/03/05 NodeJs
详解Vue.js搭建路由报错 router.map is not a function
2017/06/27 Javascript
小程序实现列表点赞功能
2018/11/02 Javascript
JavaScript数据结构之栈实例用法
2019/01/18 Javascript
一文了解vue-router之hash模式和history模式
2019/05/31 Javascript
layui 上传图片 返回图片地址的方法
2019/09/26 Javascript
JS实现随机抽选获奖者
2019/11/07 Javascript
Vue组件模板的几种书写形式(3种)
2020/02/19 Javascript
Python使用xlrd读取Excel格式文件的方法
2015/03/10 Python
python图像处理模块Pillow的学习详解
2019/10/09 Python
python匿名函数lambda原理及实例解析
2020/02/07 Python
python使用PIL剪切和拼接图片
2020/03/23 Python
浅谈PyTorch中in-place operation的含义
2020/06/27 Python
Python实现自动签到脚本功能
2020/08/20 Python
HTML5之web workers_动力节点Java学院整理
2017/07/17 HTML / CSS
ORLY官网:美国专业美甲一线品牌
2019/12/11 全球购物
医大实习自我鉴定
2013/12/07 职场文书
我的求职计划书
2014/01/10 职场文书
体育活动总结范文
2014/05/04 职场文书
办公室文员岗位职责范本
2014/06/12 职场文书
2014大学生职业生涯规划书最新范文
2014/09/13 职场文书
学习十八大宣传标语
2014/10/09 职场文书
党的群众路线教育实践活动个人批评与自我批评
2014/10/16 职场文书
全陪导游词开场白
2015/05/29 职场文书
初中班级口号霸气押韵
2015/12/24 职场文书
如何用JavaScript学习算法复杂度
2021/04/30 Javascript
Python实现简单的俄罗斯方块游戏
2021/09/25 Python