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 相关文章推荐
JS面向对象、prototype、call()、apply()
May 14 Javascript
js实现幻灯片效果(基于jquery插件)
Nov 05 Javascript
js 判断图片是否加载完以及实现图片的预下载
Aug 14 Javascript
JS如何实现文本框随文本的长度而增长
Jul 30 Javascript
基于KO+BootStrap+MVC实现的分页控件代码分享
Nov 07 Javascript
强大的 Angular 表单验证功能详细介绍
May 23 Javascript
在vue.js中抽出公共代码的方法示例
Jun 08 Javascript
Vue应用部署到服务器的正确方式
Jul 15 Javascript
Canvas放置反弹效果随机图形(实例)
Aug 17 Javascript
vue 1.x 交互实现仿百度下拉列表示例
Oct 21 Javascript
Vue.js 2.x之组件的定义和注册图文详解
Jun 19 Javascript
Vue自定义全局弹窗组件操作
Aug 11 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
Zend Framework动作控制器用法示例
2016/12/09 PHP
PHP 实现文件压缩解压操作的方法
2019/06/14 PHP
laravel框架使用FormRequest进行表单验证,验证异常返回JSON操作示例
2020/02/18 PHP
JavaScript实用技巧(一)
2010/08/16 Javascript
基于JavaScript 声明全局变量的三种方式详解
2013/05/07 Javascript
window.onload和$(function(){})的区别介绍
2013/10/30 Javascript
jquery prop的使用介绍及与attr的区别
2013/12/19 Javascript
举例讲解AngularJS中的模块
2015/06/17 Javascript
jQuery中$.extend()用法实例
2015/06/24 Javascript
JS脚本实现动态给标签控件添加事件的方法
2016/06/02 Javascript
强大的 Angular 表单验证功能详细介绍
2017/05/23 Javascript
vue cli2.0单页面title修改方法
2018/06/07 Javascript
解决vue 中 echart 在子组件中只显示一次的问题
2018/08/07 Javascript
微信小程序-可移动菜单的实现过程详解
2019/06/24 Javascript
Python 对象中的数据类型
2017/05/13 Python
python中单下划线_的常见用法总结
2018/07/10 Python
python之super的使用小结
2018/08/13 Python
Python3随机漫步生成数据并绘制
2018/08/27 Python
Python字典中的键映射多个值的方法(列表或者集合)
2018/10/17 Python
python 获取毫秒数,计算调用时长的方法
2019/02/20 Python
基于MSELoss()与CrossEntropyLoss()的区别详解
2020/01/02 Python
Python continue语句实例用法
2020/02/06 Python
Tensorflow: 从checkpoint文件中读取tensor方式
2020/02/10 Python
vscode+PyQt5安装详解步骤
2020/08/12 Python
python爬虫破解字体加密案例详解
2021/03/02 Python
印度民族服装购物网站:BIBA
2019/08/05 全球购物
小学生自我鉴定
2013/10/12 职场文书
护理专业毕业生推荐信
2013/10/31 职场文书
中秋节礼品促销方案
2014/02/02 职场文书
校车安全责任书
2014/08/25 职场文书
党政领导班子群众路线对照检查材料思想汇报
2014/09/27 职场文书
2014年实习生工作总结
2014/11/27 职场文书
锅炉工岗位职责
2015/02/13 职场文书
青年联谊会致辞
2015/07/31 职场文书
2016高考冲刺决心书
2015/09/23 职场文书
优秀乡村医生事迹材料(2016精选版)
2016/02/29 职场文书