Prototype 学习 工具函数学习($方法)


Posted in Javascript onJuly 12, 2009

$
$$
$A
$F
$H
$R
$w
Try.these
document.getElementsByClassName
$方法——被成为瑞士军刀(Swiss Army knife)
If provided with a string, returns the element in the document with matching ID; otherwise returns the passed element. Takes in an arbitrary number of arguments. All elements returned by the function are extended with Prototype DOM extensions.

function $(element) { 
if (arguments.length > 1) { 
for (var i = 0, elements = [], length = arguments.length; i < length; 
i++) 
elements.push($(arguments[i])); 
return elements; 
} 
if (Object.isString(element)) 
element = document.getElementById(element); 
return Element.extend(element); 
}

首先检查传进来的参数长度:

如果长度等于1,则判断传进来的参数是否为String,如果传进来的是String,则调用getElementById方法取得相应的对象,最后让返回的对象继承Element的所有方法,这样返回的对象将可以直接调用Element对象里面定义的各种方法。例如

// Note quite OOP-like... 
Element.hide('itemId'); 
// A cleaner feel, thanks to guaranted extension 
$('itemId').hide();

如果长度大于1,则递归调用$方法(elements.push($(arguments[i]));)就是说传进来的参数可以是多维数组:
$(['A','B',['C','D',['E','F']]]),当然了返回的也是对象数组了。
如果长度等于0,返回undefined,即直接调用alert($())
详细看一下Object.isString方法:
function isString(object) { 
return getClass(object) === "String"; 
} //=====> getClass() 
function getClass(object) { 
return Object.prototype.toString.call(object) 
.match(/^\[object\s(.*)\]$/)[1]; 
}

主要是通过Object对象的内部方法getClass来确定返回的对象是什么类型,在getClass中调用了Object的toString方法,然后通过正则表达式取出表示具体对象的字符串

Object.prototype.toString.call("2222") 返回"[object String]" 取得"String"

Object.prototype.toString.call(2222) 返回"[object Number]" 取得"Number"

Object.prototype.toString.call(/^$/) 返回"[object RegExp]" 取得"RegExp"

这里为什么要用Object的toString方法呢,因为如果直接调用"2222".toString()将返回"2222",也就是说从Object继承而来的对象,重写了toStirng方法,所以这里要调用Object的toString才行。

Javascript 相关文章推荐
javascript parseInt 大改造
Sep 27 Javascript
基于Jquery的仿Windows Aero弹出窗(漂亮的关闭按钮)
Sep 28 Javascript
利用浏览器全屏api实现js全屏
Jan 16 Javascript
jQuery分组选择器用法实例
Dec 23 Javascript
JavaScript中的函数模式详解
Feb 11 Javascript
jQuery控制Div拖拽效果完整实例分析
Apr 15 Javascript
极力推荐10个短小实用的JavaScript代码段
Aug 03 Javascript
微信小程序实现跑马灯效果完整代码(附效果图)
May 30 Javascript
js实现input密码框显示/隐藏功能
Sep 10 Javascript
layui给下拉框、按钮状态、时间赋初始值的方法
Sep 10 Javascript
用js实现放大镜效果
Oct 28 Javascript
vue使用require.context实现动态注册路由
Dec 25 Vue.js
Prototype 学习 Prototype对象
Jul 12 #Javascript
javascript 动态加载 css 方法总结
Jul 11 #Javascript
checkbox 复选框不能为空
Jul 11 #Javascript
javascript 页面只自动刷新一次
Jul 10 #Javascript
javascript div 遮罩层封锁整个页面
Jul 10 #Javascript
JQuery 实现的页面滚动时浮动窗口控件
Jul 10 #Javascript
javascript 读取xml,写入xml 实现代码
Jul 10 #Javascript
You might like
php验证手机号码(支持归属地查询及编码为UTF8)
2013/02/01 PHP
10个值得深思的PHP面试题
2016/11/14 PHP
js更优雅的兼容
2010/08/12 Javascript
JavaScript去除空格的三种方法(正则/传参函数/trim)
2013/02/06 Javascript
jquery实现隐藏与显示动画效果/输入框字符动态递减/导航按钮切换
2013/07/01 Javascript
二叉树先序遍历的非递归算法具体实现
2014/01/09 Javascript
自己使用js/jquery写的一个定制对话框控件
2014/05/02 Javascript
JavaScript中对循环语句的优化技巧深入探讨
2014/06/06 Javascript
一个不错的js html页面倒计时可精确到秒
2014/10/22 Javascript
jfreechart插件将数据展示成饼状图、柱状图和折线图
2015/04/13 Javascript
Javascript中实现String.startsWith和endsWith方法
2015/06/10 Javascript
jQuery获取元素父节点的方法
2016/06/21 Javascript
基于JavaScript实现全选、不选和反选效果
2017/02/15 Javascript
bootstrap栅格系统示例代码分享
2017/05/22 Javascript
使用validate.js实现表单数据提交前的验证方法
2018/09/04 Javascript
Vue 嵌套路由使用总结(推荐)
2020/01/13 Javascript
JavaScript实现多个物体同时运动
2020/03/12 Javascript
[01:01:24]DOTA2上海特级锦标赛A组败者赛 EHOME VS CDEC第三局
2016/02/25 DOTA
Python中的闭包总结
2014/09/18 Python
Python实现堆排序的方法详解
2016/05/03 Python
Python实现统计给定列表中指定数字出现次数的方法
2018/04/11 Python
python3实现表白神器
2019/04/09 Python
Python3.5模块的定义、导入、优化操作图文详解
2019/04/27 Python
Python 20行简单实现有道在线翻译的详解
2019/05/15 Python
Python Django 添加首页尾页上一页下一页代码实例
2019/08/21 Python
python opencv根据颜色进行目标检测的方法示例
2020/01/15 Python
Django之choices选项和富文本编辑器的使用详解
2020/04/01 Python
中国最大的名表商城:万表网
2016/08/29 全球购物
英国露营设备和户外服装购物网站:Simply Hike
2019/05/05 全球购物
信息技术教学反思
2014/02/12 职场文书
司机检讨书
2014/02/13 职场文书
《最可爱的人》教学反思
2014/02/14 职场文书
政治学专业毕业生求职信
2014/08/11 职场文书
2014年艾滋病防治工作总结
2014/12/10 职场文书
Oracle中update和select 关联操作
2022/01/18 Oracle
Python采集壁纸并实现炫轮播
2022/04/30 Python