Introduc)on*to*jQuery* - Yo Briefca · Sizzle 1,125 Selector Performance jQuery 1.2.6 Firefox 3...
Transcript of Introduc)on*to*jQuery* - Yo Briefca · Sizzle 1,125 Selector Performance jQuery 1.2.6 Firefox 3...
Introduc)on to jQuery
Overview
Overview
Non-‐Pollu)ng
jQuery.noConflict();
Small Footprint
~ 19KB (Minified & Gzipped)
Cross Browser Compliant
A+
Extensible
Selector Performance
Popularity (Support & Innova)on)
Simple Premise
$(“#id”, “div.class”) .show() .$(…)
Chainability
$(“#id”) .hide() .width(300) .fadeIn()
The jQuery Object
$(…) The jQuery Func)on
The API
Extending
Custom Filters
/*
* jQuery Input Modified Filter
*/
$.extend($.expr[':'], {
modified: func)on(el) {
return $(el).is("input") && el.defaultValue != el.value;
}
}); /* Clear all modified input elements */ $("input:modified") .val(“”);
Custom Plugin
/*
* jQuery Zebra Stripping Plugin
*/
jQuery.fn.zebra = funcQon(odd, even) {
return this.find("tr:odd").css("background-‐color", odd)
.end().find("tr:even").css("background-‐color", even);
} //or $.fn.extend({ zebra : funcQon(){…} })
/* Apply Stripping to all tables in DOM */
$("table").zebra("#fff", "#eee");
Why jQuery?
vs.
vs.
vs.
vs.
vs.
Ques)ons?