ict.ken.be

 

jQuery Overview

Related Posts

Categories: Javascript

A selector overview you can find at: https://ict.ken.be/selectors

$(selector) -> jQuery(selector) //jQuery.noConflict();
$(function() {}); -> $(document).ready(function() {});

.html();
$.trim(someString)
$("<div>"); -> $("<div/>"); -> $("<div></div>");
$("<p>inserted</p>").insertAfter(selector);
.end() //revert back to full set after a filter
.size(); //eg. $("#someDiv").html('There are '+$('a').size()+' links on this page.');
$('img[alt]').get(0) -> $('img[alt]')[O]
$('label+button').get();
$('img').index($('img#findMe')[0]);
$('img[alt], img[title]'); -> $('img[alt]').add('img[title]'); //or
$('img[title]').not('[title*=puppy]');
.filter(expression or fuction returning bool or selector);
.match(regex);
.slice(begin,end);
.children(), .contents(), .next(), .nextAll(), .parent(), .parents(), .prev(), .prevAll(), .siblings()
.addClass();
.find();
.contains();
.is(selector); //if any element in the wrapped set matches the selector
.clone();
.andSelf(); //merges two previous wrapped sets in a command chain

$.fn.disable = function () {} //extending jQuery

.each(function(n) {});

.append('<p>some html</p>')

if (!event) event = window.event; //IE
var target = (event.target) ? event.target : event.srcElement; //IE

$('*').each(function() {}); //for every element on the page

stopPropagation(); //stop bubbling up
return false; // will cancel the default semantics/actions and bubble

addEventListener('click', function(event) {}, useCapture); //DOM Level 2, use capture is false for bubble phase and true for capture - IE uses attachEvent()

.bind('click'), function(event) {}); //jQuery encapsultes the attachEvent and addEventListener
.one() //handler removed after one execution
$('*').unbind('click.editMode'); //namespace through suffix

.trigger(eventType);
.eventName(); //blur, click, focus, select, submit
.toggle(listenerOdd, listenerEven);
.hover(overListerner,outListener); //mouseover and mouseout will trigger on transitions of contained elements, hover will not

<label></label> //progressive disclosure: use to enclose radio and text, so clicking either will trigger click of control

EVENTS

Events: blur, change, click, dblclick, error, focus, keydown, keypress, keyup, load, mousedown, mousemove, mouseout, mouseover, mouseup, resize, scroll, select, submit, unload

Safe event instance properties: altKey, ctrlKey, data, keyCode, metaKey, pageX, pageY, relatedTarget, screenX, screenY, shiftKey, target, type, which

APPENDIX

  • a closure is a function instance coupled with the local variables from its enviroment that are necessary for its execution.
  • javascript object is an unordered collection of name/value pairs
  • class attribute is represented by the className attribute property
  • an event bubbles all the way up until the root