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限定复选框的选择个数示例代码
Aug 25 Javascript
第四篇Bootstrap网格系统偏移列和嵌套列
Jun 21 Javascript
js删除数组元素、清空数组的简单方法(必看)
Jul 27 Javascript
Move.js入门
Feb 08 Javascript
vue中动态设置meta标签和title标签的方法
Jul 11 Javascript
vue2.0 中使用transition实现动画效果使用心得
Aug 13 Javascript
从零开始学习搭建React脚手架项目
Aug 23 Javascript
JsonProperty 的使用方法详解
Oct 11 Javascript
微信小程序动态添加和删除组件的现实
Feb 28 Javascript
JavaScript实现捕获鼠标坐标
Apr 12 Javascript
微信小程序实现手指拖动选项排序
Apr 22 Javascript
vue2实现provide inject传递响应式
May 21 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 正则表达式小结
2009/08/31 PHP
利用PHP实现短域名互转
2013/07/05 PHP
PHP Curl出现403错误的解决办法
2014/05/29 PHP
Yii2如何批量添加数据
2016/05/17 PHP
php获取目录中所有文件名及判断文件与目录的简单方法
2017/03/04 PHP
PHP基于DOMDocument解析和生成xml的方法分析
2017/07/17 PHP
prototype Element学习笔记(篇一)
2008/10/26 Javascript
javascript实现时间格式输出FormatDate函数
2015/01/13 Javascript
jquery的父、子、兄弟节点查找,节点的子节点循环方法
2016/12/07 Javascript
jQuery实现加入收藏夹功能(主流浏览器兼职)
2016/12/24 Javascript
jQuery监听浏览器窗口大小的变化实例
2017/02/07 Javascript
Node.js创建Web、TCP服务器
2017/12/05 Javascript
详细教你微信公众号正文页SVG交互开发技巧
2019/07/25 Javascript
JavaScript Reflect Metadata实现详解
2019/12/12 Javascript
Websocket 向指定用户发消息的方法
2020/01/09 Javascript
js实现网页版贪吃蛇游戏
2020/02/22 Javascript
JavaScript实现旋转木马轮播图
2020/03/16 Javascript
python之模拟鼠标键盘动作具体实现
2013/12/30 Python
Ubuntu 14.04+Django 1.7.1+Nginx+uwsgi部署教程
2014/11/18 Python
Python中防止sql注入的方法详解
2017/02/25 Python
Python编程实现的图片识别功能示例
2017/08/03 Python
Python快速转换numpy数组中Nan和Inf的方法实例说明
2019/02/21 Python
Python使用matplotlib 模块scatter方法画散点图示例
2019/09/27 Python
python中用Scrapy实现定时爬虫的实例讲解
2021/01/18 Python
阿拉伯世界最大的电子商务网站:Souq沙特阿拉伯
2016/10/28 全球购物
Pam & Gela官网:美国性感前卫女装品牌
2018/07/19 全球购物
毕业研究生的自我鉴定
2013/11/30 职场文书
教师爱岗敬业演讲稿
2014/05/05 职场文书
元旦联欢会策划方案
2014/06/11 职场文书
城市规划应届毕业生自荐信
2014/07/04 职场文书
机关驾驶员违规检讨书
2014/09/13 职场文书
2014年新农村建设工作总结
2014/12/01 职场文书
房屋分割离婚协议书范本
2014/12/01 职场文书
给客户的检讨书
2014/12/21 职场文书
中小学教师继续教育心得体会
2016/01/19 职场文书
JavaWeb Servlet实现网页登录功能
2021/07/04 Java/Android