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 文件夹选择框的两种解决方案
Jul 01 Javascript
jquery 定位input元素的几种方法小结
Jul 28 Javascript
js 处理数组重复元素示例代码
Dec 27 Javascript
apply和call方法定义及apply和call方法的区别
Nov 15 Javascript
javascript实现禁止复制网页内容汇总
Dec 30 Javascript
springMVC结合AjaxForm上传文件
Jul 12 Javascript
jquery轮播的实现方式 附完整实例
Jul 28 Javascript
Bootstrap CSS组件之分页(pagination)和翻页(pager)
Dec 17 Javascript
Web前端框架bootstrap实战【第一次接触使用】
Dec 28 Javascript
对vue中v-on绑定自定事件的实例讲解
Sep 06 Javascript
vue中轮训器的使用
Jan 27 Javascript
基于vue和websocket的多人在线聊天室
Feb 01 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
需要使用php模板的朋友必看的很多个顶级PHP模板引擎比较分析
2008/05/26 PHP
基于OpenCV的PHP图像人脸识别技术
2009/10/11 PHP
Mysql中分页查询的两个解决方法比较
2013/05/02 PHP
php导入大量数据到mysql性能优化技巧
2014/12/29 PHP
php给数组赋值的实例方法
2019/09/26 PHP
PHP用swoole+websocket和redis实现web一对一聊天
2019/11/05 PHP
PHP获取类私有属性的3种方法
2020/09/10 PHP
菜鸟javascript基础整理1
2010/12/06 Javascript
js 文本滚动效果的实例代码
2013/08/17 Javascript
JS+CSS实现仿msn风格选项卡效果代码
2015/10/22 Javascript
JS组件系列之使用HTML标签的data属性初始化JS组件
2016/09/14 Javascript
JQuery实现图片轮播效果
2017/05/08 jQuery
详细讲解vue2+vuex+axios
2017/05/27 Javascript
Node.js+Express+MySql实现用户登录注册功能
2017/07/10 Javascript
es6在react中的应用代码解析
2017/11/08 Javascript
Vue中自定义全局组件的实现方法
2017/12/08 Javascript
Vue 进阶之路(三)
2019/04/18 Javascript
BootstrapValidator验证用户名已存在(ajax)
2019/11/08 Javascript
在博客园博文中添加自定义右键菜单的方法详解
2020/02/05 Javascript
Vue computed 计算属性代码实例
2020/04/22 Javascript
Python中的深拷贝和浅拷贝详解
2015/06/03 Python
django实现登录时候输入密码错误5次锁定用户十分钟
2017/11/05 Python
Python字典操作详细介绍及字典内建方法分享
2018/01/04 Python
numpy中实现二维数组按照某列、某行排序的方法
2018/04/04 Python
python中cPickle类使用方法详解
2018/08/27 Python
python利用JMeter测试Tornado的多线程
2020/01/12 Python
Structs界面控制层技术
2013/10/11 面试题
教师专业理论水平的自我评价分享
2013/11/09 职场文书
硕士研究生个人求职信
2013/12/04 职场文书
营业员演讲稿
2013/12/30 职场文书
酒店led欢迎词
2014/01/09 职场文书
企业党员公开承诺书
2014/03/26 职场文书
区域销售主管岗位职责
2014/06/15 职场文书
教师师德考核自我评价
2014/09/13 职场文书
2014年职称评定工作总结
2014/11/26 职场文书
python实现简易自习室座位预约系统
2021/06/30 Python