模仿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实现单行文本向上滚动效果实例代码
Nov 28 Javascript
JavaScript设置body高度为浏览器高度的方法
Feb 09 Javascript
jQuery实现表单步骤流程导航代码分享
Aug 28 Javascript
jQuery使用正则表达式限制文本框只能输入数字
Jun 18 Javascript
JavaScript排序算法动画演示效果的实现方法
Oct 18 Javascript
JS中使用media实现响应式布局
Aug 04 Javascript
基于jQuery的$.getScript方法去加载javaScript文档解析
Nov 08 jQuery
基于Vue自定义指令实现按钮级权限控制思路详解
May 23 Javascript
vue使用Font Awesome的方法步骤
Feb 26 Javascript
vue项目接口管理,所有接口都在apis文件夹中统一管理操作
Aug 13 Javascript
Openlayers3实现车辆轨迹回放功能
Sep 29 Javascript
详解vue之自行实现派发与广播(dispatch与broadcast)
Jan 19 Vue.js
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中在数据库中保存Checkbox数据(1)
2006/10/09 PHP
Symfony2 session用法实例分析
2016/02/04 PHP
php实现简单爬虫的开发
2016/03/28 PHP
mysql_escape_string()函数用法分析
2016/04/25 PHP
Mootools 1.2教程 正则表达式
2009/09/15 Javascript
读jQuery之五(取DOM元素)
2011/06/20 Javascript
javascript向flash swf文件传递参数值注意细节
2012/12/11 Javascript
js 调用父窗口的具体实现代码
2013/07/15 Javascript
用js正确判断用户名cookie是否存在的方法
2014/01/28 Javascript
json的定义、标准格式及json字符串检验
2014/05/11 Javascript
JavaScript实现点击单选按钮改变输入框中文本域内容的方法
2015/08/12 Javascript
纯js代码实现未知宽高的元素在指定元素中垂直水平居中显示
2015/09/12 Javascript
javascript事件冒泡简单示例
2016/06/20 Javascript
原生js实现键盘控制div移动且解决停顿问题
2016/12/05 Javascript
bootstrapValidator表单验证插件学习
2016/12/30 Javascript
seajs中最常用的7个功能、配置示例
2017/10/10 Javascript
BootStrap 标题设置跨行无效的解决方法
2017/10/25 Javascript
Vue.JS项目中5个经典Vuex插件
2017/11/28 Javascript
完美解决axios跨域请求出错的问题
2018/02/05 Javascript
vue获取当前点击的元素并传值的实例
2018/03/09 Javascript
laydate如何根据开始时间或者结束时间限制范围
2018/11/15 Javascript
[40:17]2018DOTA2亚洲邀请赛 4.5 淘汰赛 LGD vs Liquid 第一场
2018/04/06 DOTA
python实现复制整个目录的方法
2015/05/12 Python
Python 中 Meta Classes详解
2016/02/13 Python
Python实现二叉树结构与进行二叉树遍历的方法详解
2016/05/24 Python
Python中static相关知识小结
2018/01/02 Python
Python 格式化打印json数据方法(展开状态)
2020/02/27 Python
python爬虫基础知识点整理
2020/06/02 Python
大学毕业登记表自我鉴定
2013/10/09 职场文书
大四学生毕业自荐信
2013/11/07 职场文书
2014年基层党组织公开承诺书
2014/03/29 职场文书
妇女工作先进事迹
2014/08/17 职场文书
2014年化验员工作总结
2014/11/18 职场文书
2014年艾滋病防治工作总结
2014/12/10 职场文书
公司规章制度范本
2015/08/03 职场文书
员工工作失职检讨书范文!
2019/07/03 职场文书