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 相关文章推荐
彪哥1.1(智能表格)提供下载
Sep 07 Javascript
List the Codec Files on a Computer
Jun 18 Javascript
电子商务网站上的常用的js放大镜效果
Dec 08 Javascript
JS自调用匿名函数具体实现
Feb 11 Javascript
JsRender for object语法简介
Oct 31 Javascript
jquery实现多屏多图焦点图切换特效的方法
May 04 Javascript
jQuery validate插件实现ajax验证重复的2种方法
Jan 22 Javascript
基于 Vue.js 之 iView UI 框架非工程化实践记录(推荐)
Nov 21 Javascript
浅谈Webpack 持久化缓存实践
Mar 22 Javascript
浅谈js闭包理解
Mar 28 Javascript
JS实现星星海特效
Dec 24 Javascript
html2canvas属性和使用方法以及如何使用html2canvas将HTML内容写入Canvas生成图片
Jan 12 Javascript
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
综合图片计数器
2006/10/09 PHP
一段php加密解密的代码
2007/07/16 PHP
php弹出对话框实现重定向代码
2014/01/23 PHP
PHP获取指定函数定义在哪个文件中以及其所在的行号实例
2014/05/08 PHP
CodeIgniter框架过滤HTML危险代码
2014/06/12 PHP
php使用正则表达式获取图片url的方法
2015/01/16 PHP
PHP实现常用排序算法的方法
2020/02/05 PHP
Javascript 自定义类型方法小结
2010/03/02 Javascript
ASP.NET中AJAX 调用实例代码
2012/05/03 Javascript
JavaScript通过事件代理高亮显示表格行的方法
2015/05/27 Javascript
浅谈jQuery中height与width
2015/07/06 Javascript
实例讲解jQuery中对事件的命名空间的运用
2016/05/24 Javascript
EasyUI布局 高度自适应
2016/06/04 Javascript
JavaScript解八皇后问题的方法总结
2016/06/12 Javascript
JS基于onclick事件实现单个按钮的编辑与保存功能示例
2017/02/13 Javascript
Angular2实现组件交互的方法分析
2017/12/19 Javascript
浅谈vuepress 踩坑记
2018/04/18 Javascript
vue使用pdfjs显示PDF可复制的实现方法
2018/12/14 Javascript
vue实现短信验证码登录功能(流程详解)
2019/12/10 Javascript
梳理一下vue中的生命周期
2020/12/30 Vue.js
python实现八大排序算法(1)
2017/09/14 Python
Pycharm运行加载文本出现错误的解决方法
2019/06/27 Python
python hough变换检测直线的实现方法
2019/07/12 Python
Python Web框架之Django框架文件上传功能详解
2019/08/16 Python
Keras 使用 Lambda层详解
2020/06/10 Python
用python实现学生管理系统
2020/07/24 Python
关于PyCharm安装后修改路径名称使其可重新打开的问题
2020/10/20 Python
pip/anaconda修改镜像源,加快python模块安装速度的操作
2021/03/04 Python
AmazeUI 等分网格的实现示例
2020/08/25 HTML / CSS
十佳少先队员演讲稿
2014/09/12 职场文书
晚自修旷课检讨书怎么写
2014/11/17 职场文书
先进员工事迹材料
2014/12/20 职场文书
钢铁是怎样炼成的读书笔记
2015/06/29 职场文书
交流会主持词
2015/07/02 职场文书
初中教务主任竞聘演讲稿(范文)
2019/08/20 职场文书
多线程Spring通过@Scheduled实现定时任务
2022/05/25 Java/Android