prototype框架中美元符号$用法分析


Posted in Javascript onJanuary 22, 2016

本文实例讲述了prototype框架中美元符号$用法。分享给大家供大家参考,具体如下:

prototype是实现面向对象的一个重要工具,是javascript的一个不错的框架。
用jquery的人都知道,jquery中也有$美元符号,prototype中呢,也有$,他们有什么区别呢。

1、prototype中$()的用法

prototype写法 $("test") 或者 $$("#test"), 他相当于js中document.getElementById("test");
jqueryp写法 $("#test") ,他也相当于js中document.getElementById("test");

2、prototype中的$$()用法

jquery写法 $("div") 他相当于document.getElementsByTagName('div')
如果prototype也想简单取得页面中所有div元素,就不能这样写了。
prototype写法  $("div") 他相当于document.getElementById("div")
prototype写法  $$("div") 他相当于document.getElementsByTagName('div')
prototype写法 $$("input[value=tank]") 取得页面中输入框值为tank的标签,其实和jquery差不多,只不过多了一个$符号而已

3、prototype中的$A()用法

$A 主要是用来将可当作数组使用的任意集合(如 NodeList、许多 DOM 方法返回的 HTMLCollection 或函数对象的 arguments 属性)转换为一个真正的 Array 对象。下面四种方法都可以隐藏页面中的div标签

$A($$('div')).each(Element.hide); 
$A($$('div')).map(Element.extend).invoke("hide"); 
//从思想上来看,下面二种写法,我在用jquery时,也经常用 
$A($$('div')).each(function(name,index){ 
 name.style.display='none'; 
 alert(name.innerHTML); 
 }) 
 $A($$('div')).each(function(name,index){ 
 $(name).hide(); 
})

如果例子中出现TypeError: element.style is undefined { message="element.style is undefined",  more...},请把你的prototype的版本升一下级

4、prototype中的$F()用法

个人觉得$F的用法,被设计出来是为了更方便的取表单数据,不过它比较单一,因为他只能通过ID来取

<input name="name" value="tank" id="name">
$F("name")  正确的

<input name="name" value="tank"  >
$F("name")  不正确的,TypeError: element is null { message="element is null", more...}

5、prototype中的$H()用法

当你传入一下对像作为函数的参数时,$H将输入对像一个prototype的专有hash对像。$H感觉像是转换器,启到一个改变形势的作用

$H({name:'tank',sex:1,height:'170cm'}).toArray()
[["name", "tank"], ["sex", 1], ["height", "170cm"]]
$H({name:'tank',sex:1,height:'170cm'}).toQueryString()
"name=tank&sex=1&height=170cm"

6、prototype中的$R()用法

$R函数和原始的构造函数具有完全相同的参数:start 和 end 分别表示下限值和上限值(两个参数的类型必须一致),exclusive 表示是否排除上限值(参数 end)。默认不排除上限值。

$R的实例描述了一系列遵循某种规则变化的值,如数字、 文本或其它在语义上支持相邻值推导的类型

能过例子,来说明,最容易让人记住了

$A($R("a","z",true)).join(',') //加了参数true 
"a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y" 
$A($R("a","z")).join(',') //没有加 
"a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z"

$R根据规则推测了一个$R对像,$A将这个对像转换成了数组,用,号将数组转换成字符串.

$R(0, 10).each(function(value){ 
 alert(value*value); 
}); 
//结果和上面的一样的,但是each解释的对像是不一样的。 
$A($R(0, 10)).each(function(value){ 
 alert(value*value); 
});

如果报这样的错误 ,TypeError: value.succ is not a function { message="value.succ is not a function", more...},请升级

7、prototype中的$w()用法

$w将以空格是为分隔符的字符串,转换成数组,根php的explode(" ",$string);功能是一样的,针对性比较强。

$w("aa bb").join(',')

如果报这样的错误 ,ReferenceError: $w is not defined { message="$w is not defined",  more...},请升级

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript instanceof 的使用方法示例介绍
Oct 23 Javascript
用JS在浏览器中创建下载文件
Mar 05 Javascript
如何编写高质量JS代码
Dec 28 Javascript
基于jQuery实现简单的折叠菜单效果
Nov 23 Javascript
jQuery Tags Input Plugin(添加/删除标签插件)详解
Jun 20 Javascript
JS滚动到指定位置导航栏固定顶部
Jul 03 Javascript
JS实现登录页密码的显示和隐藏功能
Dec 06 Javascript
解决iView中时间控件选择的时间总是少一天的问题
Mar 15 Javascript
简单易扩展可控性强的Jquery转盘抽奖程序
Mar 16 jQuery
uni app仿微信顶部导航条功能
Sep 17 Javascript
微信小程序中限制激励式视频广告位显示次数(实现思路)
Dec 06 Javascript
JS实现无限轮播无倒退效果
Sep 21 Javascript
详解javascript传统方法实现异步校验
Jan 22 #Javascript
jquery.validate提示错误信息位置方法
Jan 22 #Javascript
jQuery ajax时间差导致的变量赋值问题分析
Jan 22 #Javascript
jQuery简单获取键盘事件的方法
Jan 22 #Javascript
基于JavaScript实现高德地图和百度地图提取行政区边界经纬度坐标
Jan 22 #Javascript
CSS或者JS实现鼠标悬停显示另一元素
Jan 22 #Javascript
鼠标悬停小图标显示大图标
Jan 22 #Javascript
You might like
《星际争霸2》终章已出 RTS时代宣告终结
2017/02/07 星际争霸
ecshop 批量上传(加入自定义属性)
2012/03/20 PHP
PHP引用符&amp;的用法详细解析
2013/08/22 PHP
php文件上传的简单实例
2013/10/19 PHP
深入剖析浏览器退出之后php还会继续执行么
2016/05/17 PHP
PHP中strpos、strstr和stripos、stristr函数分析
2016/06/11 PHP
Laravel获取当前请求的控制器和方法以及中间件的例子
2019/10/11 PHP
禁止F5等快捷键的JS代码
2007/03/06 Javascript
jQuery 动画基础教程
2008/12/25 Javascript
JavaScript OOP类与继承
2009/11/15 Javascript
vs2003 js文件编码问题的解决方法
2010/03/20 Javascript
用js将内容复制到剪贴板兼容浏览器
2014/03/18 Javascript
jQuery判断当前点击的是第几个li的代码
2014/09/26 Javascript
Javascript学习笔记之函数篇(四):arguments 对象
2014/11/23 Javascript
JS控制网页动态生成任意行列数表格的方法
2015/03/09 Javascript
jQuery插件EnPlaceholder实现输入框提示文字
2015/06/05 Javascript
Vue组件之极简的地址选择器的实现
2018/05/31 Javascript
Webpack之tree-starking 解析
2018/09/11 Javascript
微信小程序实现左滑动删除效果
2020/03/30 Javascript
Vue + Element UI图片上传控件使用详解
2019/08/20 Javascript
如何正确理解vue中的key详解
2019/11/02 Javascript
iSlider手机端图片滑动切换插件使用详解
2019/12/24 Javascript
[47:06]DOTA2上海特级锦标赛主赛事日 - 4 败者组第五轮 MVP.Phx VS EG第一局
2016/03/05 DOTA
python调用Moxa PCOMM Lite通过串口Ymodem协议实现发送文件
2014/08/15 Python
python素数筛选法浅析
2018/03/19 Python
python3文件复制、延迟文件复制任务的实现方法
2019/09/02 Python
使用IPython或Spyder将省略号表示的内容完整输出
2020/04/20 Python
蔻驰英国官网:COACH英国
2020/07/19 全球购物
入党申请人的自我鉴定
2013/12/01 职场文书
医学生毕业自我鉴定
2014/03/26 职场文书
艺术设计专业个人求职信
2014/04/10 职场文书
2014教师党员自我评议总结
2014/09/19 职场文书
整改通知书
2015/04/20 职场文书
2015年小学体育工作总结
2015/05/22 职场文书
心理健康教育主题班会
2015/08/13 职场文书
2016年保险公众宣传日活动总结
2016/04/05 职场文书