| Event | Prototype | jQuery | Also recommended for coreBOS |
| Selecting DOM Elements | $('id') | jQuery("#id") | document.getElementById("id") |
| $$(selector)[x] | jQuery(selector).eq(x) | ||
| GET/SET content | $F('id') | jQuery("#id").val() | |
| .innerHTML | .html() | document.getElementById(element).innerHTML | |
| element.update('new content') | element.html('new content'); vtlib_executeJavascriptInElement(document.getElementById(element)); | document.getElementById(element).innerHTML='new_content'; vtlib_executeJavascriptInElement(document.getElementById(element)); | |
| .value = x | .val(x) | ||
| Update style | .style.x = 'y' | .css({ x: 'y' }) | |
| .setStyle( style(s) ) | .css( propertyName, value ) | ||
| .hasClassName( className ) | .hasClass( className ) | ||
| .addClassName( className ) | .addClass( className(s) ) | ||
| Get/Set Attributes | .checked | .prop('checked') | |
| disabled | .prop('disabled') | ||
| .some_attr | .attr('some_attr') | ||
| .getWidth() | .width() | ||
| .empty() | .is(':empty') | ||
| Effects | .fade({duration: x}) | .fadeOut(x * 1000) | |
| .appear({duration: x}) | .appear({duration: x}) | ||
| Effect.Appear | .fadeOut(x * 1000) | ||
| Effect.Appear | fadeIn() | ||
| Effect.Fade | fadeOut() | ||
| Event Handlers | $(element_id).observe("click", function(event){ ... }) | jQuery('#'+element_id).bind("click", function(jQueryEvent){ ... }) | |
| document.observe("dom:loaded", function() { ... }); | $(document).ready() | ||
| Event.observe(element, eventName, handler) | $('selector').bind(eventType, handler) | ||
| Sortable.create("element" { constraint:false, tag:'div', overlap:'Horizontal', handle:'headerrow', onUpdate:function(){ // do smth } }) | jQuery("#element").sortabe({ constraint: false, tag: 'div', overlap: 'Horizontal', handle: '.headerrow', update: function () { //do smth } }) | ||
| AJAX | new Ajax.Request('index.php', { queue : {position : 'end', scope : 'command'}, method : 'post', postBody : "urlstring", onComplete : function(response) { // do smth } }); | jQuery.ajax({ method: 'POST', url:'urlstring', }).done(function (response) { //do smth }); |