首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

JQuery跟Prototype区别小结

2012-09-25 
JQuery和Prototype区别小结?// Prototype$ ( idname )?根据类名// JQuery$ ( .classname )// Protot

JQuery和Prototype区别小结

?

    // 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' );

?

    // Prototypenew   Ajax . Request ( url ,   {
    ? ? ? ? method : 'get' ,? ? ? ? onSuccess : function ( transport , json ) {? ? ? ? ? ? ? ? alert ( json . name );? ? ? ? }});

可以得出结论:jQuery和Prototype大部分是极为相似的,多用几次就都熟了。。

热点排行