JQuery和Prototype区别小结
jQuery使用得比较顺手也比较喜欢,不得已也要用Prototype,小小整理下区别。。
页面载入
-
// JQuery
- $ ( document ). ready ( function () {
- // Code
- });
-
// JQuery Shorthand
- $ ( function () {
- // Code
- });
-
// Prototype
- document . observe ( 'dom:loaded' , function () {
- // Code
- });
根据ID获取
-
// JQuery
- $ ( "#idname" );
-
// Prototype
- $ ( "idname" );
根据类名
-
// JQuery
- $ ( ".classname" );
-
// Prototype
- $$ ( '.classname' );
根据第一个符合的类名
-
// JQuery
- $ ( ".classname:first-child" );
-
// Prototype
- $$ ( '.classname' )[ 0 ];
根据ID绑定监听事件
-
// JQuery
- $ ( "#item" ). bind ( 'click' , function () {
- // Code
- });
-
- // JQuery Shorthand
- $ ( "#item" ). click ( function () {
- // Code
- });
-
// Prototype
- $ ( "#item" ). observe ( 'click' , function () {
- // code
- });
根据符合的类名绑定监听事件
-
$(".classname").bind('click',function(){
- // code
- });
-
- // JQuery Shorthand
- $ ( ".classname" ). click ( function () {
- // code
- });
-
// Prototype
- $$ ( ".classname" ). invoke ( 'observe' , 'click' , function () {
- // code
- });
结束终止事件
-
// JQuery
- $ ( "#id" ). click ( function () {
-
- //code
- return false ;
- });
-
// Prototype
- $ ( "id" ). observe ( 'click' , function ( e ) {
- //code
- Event . stop ( e );
- });
处理观察的元素
-
// JQuery
- $ ( '#idname' ). click ( function () {
- this . hide (); // Hide the item clicked
- });
-
// Prototype
- $ ( 'idname' ). observe ( 'click' , function ( e ) {
- el = e . findElement ;
- el . hide (); // hide the item clicked
- });
根据ID操作类名
-
// JQuery
- $ ( '#id' ). addClass ( 'red' );
- $ ( '#id' ). removeClass ( 'red' );
-
// Prototype
- $ ( 'id' ). addClassName ( 'red' );
- $ ( 'id' ). removeClassName ( 'red' );
根据类名操作类名。。
-
// JQuery
- $ ( '.class' ). addClass ( 'red' );
- $ ( '.class' ). removeClass ( 'red' );
-
// Prototype
- $$ ( '.class' ). invoke ( 'addClassName' , 'red' );
- $$ ( '.class' ). invoke ( 'removeClassName' , 'red' );
AJAX请求和JSON应用
-
$.get(url,function(data){
alert(data . name );
- }, 'JSON' );
-
// Prototype
new Ajax . Request ( url , {
- method : 'get' ,
- onSuccess : function ( transport , json ) {
- alert ( json . name );
- }
- });
可以得出结论:jQuery和Prototype大部分是极为相似的,多用几次就都熟了。。
分享到:
相关推荐
Ajax(Ajax,jquery,prototype综合).rar
json,jQuery,prototype
最新Javascript开源框架,包含API帮助文档的学习网址。资源共享!
里面有现在web开发主流框架,jquery bootstrap prototype
俩大JS框架,Jquery和Prototype
包含经典电子书 CSS Jquery DHTML Prototype
jQuery.fn和jQuery.prototype想必大家对它并不陌生吧,那么你们知道它们之间的区别吗?在本文有个不错的示例大家可以参考下
CSS2.0样式表中文手册.chm CSS3.0(飘零雾雨版).chm HTML4.01&XHTML; 1.0参考手册.chm ...jquery-1.7.2.js jquery-1.7.2.min.js jQuery1.7.1_API中文手册.pdf jQueryAPI_1.7.1_CN.chm prototype1.7.js
小议JavaScript库——Dojo、jQuery和PrototypeJS的比较.pdf
javascript手册大全,其中有jquery,prototype手册的,非常全的JS手册!!!
jquery+prototype 源码 资料 插件合集 很有参考价值
JQuery可编辑表格小结.docx JQuery可编辑表格小结.docx JQuery可编辑表格小结.docx JQuery可编辑表格小结.docx
Jquery.validate表单验证小结
jQuery、Mootools、Prototype三大JavaScript框架中文手册
phonegap+jquerymobile开发经验小结
jQuery是继prototype之后又一个优秀的Javascrīpt框架。其宗旨是——WRITE LESS,DO MORE,写更少的代码,做更多的事情。它是轻量级的js库(压缩后只有21k) ,这是其它的js库所不及的,它兼容CSS3,还兼容各种浏览器 ...
这是本人在学习jQuery框架Prototype的时候做的笔记,很详细
以前好像在哪里看到过说jQuery与prototype存在冲突,但一直没在意。今天把自己用jquery框架写好的消息提示框特效放到公司原来的系统发现所有的消息提示效果都罢工了! 汗了半天还是没有发现原因,突然想到jquery与...
最新JQuery Prototype 帮助CHM格式,非常值得收藏
常用的JQuery函数及功能小结_.docx