SlideServe
Télécharger Obtenir Pro
Menu
Accueil Pro
Préférences
ApparenceLight Aide et commentaires
© SlideServe · v2026

jQuery

tyanne avatar
tyanne
11 diapositives · 311 Views · Jul 24, 2014

jQuery. Fairway Code Brew. Agenda. What is jQuery ? No, really, what is it? Show me something cool Why should I use it? Disturbing photo More features FlexBox ( jQuery Plugin ) Is Brett pointing to his watch yet because it’s lunchtime?. That wasn’t cool enough…try again.

jQuery - slide 1
01 / 11jQuery
1 / 17

Télécharger la présentation

jQuery
Une image / un lien ci-dessous est fourni (tel quel) pour télécharger la présentation

Politique de téléchargement : le contenu du site vous est fourni TEL QUEL pour votre information et votre usage personnel ; il ne peut être vendu, concédé sous licence ni partagé sur d’autres sites sans l’accord de son auteur.Le contenu vous est fourni TEL QUEL, pour votre information et votre usage personnel uniquement. Téléchargez la présentation en cliquant sur ce lien. Lors du téléchargement, si vous ne parvenez pas à télécharger une présentation, l’éditeur a peut-être supprimé le fichier de son serveur.Pendant le téléchargement, si vous ne parvenez pas à obtenir une présentation, le fichier a peut-être été supprimé par l’éditeur.

F I N

Plus de contenu associé

Transcription de la présentation

  1. jQuery Fairway Code Brew

  2. Agenda • What is jQuery? • No, really, what is it? • Show me something cool • Why should I use it? • Disturbing photo • More features • FlexBox (jQueryPlugin) • Is Brett pointing to his watch yet because it’s lunchtime? That wasn’t cool enough…try again • Hidden Agenda: • Avoid being voled • Eat delicious pie

  3. What is jQuery? • jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript. • Lightweight Footprint About 15KB in size (Minified and Gzipped) • CSS3 Compliant Supports CSS 1-3 and basic XPath • Cross-browser IE 6.0+, FF 2+, Safari 2.0+, Opera 9.0+ I totally stole all of this

  4. No, really, what is it? • It’s a magical dollar sign wrapper / selector / chainer / do-er: • “Get me the input box with id ‘splek’, and make it wiiide” $("#splek").css("width", 800); • “Get me all of the elements where class=‘bilp’, and hide them” $(".bilp").hide(); • “Get me a gin and tonic” $("im.sorry").dave("im.afraid").i(cant).doThat(); Without jQuery With jQuery

  5. Show me something cool • Old way var links = document.getElementsByTagName("a"); for (vari = 0; i < links.length; i++) { var link = links[i]; link.cssClass += "nerdbasket"; link.innerHTML = "vole"; link.style.display = ""; } • jQuery way $("a").addClass("nerdbasket").html("vole").show(); Ooh, chainability!

  6. Not cool enough…try again • Okay, how about something Ajax-y, like GETting a web page and processing the response in a JavaScript callback function? $.get("funpage.aspx", function(data) { alert("Data Loaded: " + data); }); $.getJSON(“notfoo.aspx", {id:1}, function(data) { $("#x").html(data.lastName + ", " + data.firstName); }); Okay, that’s pretty cool. Almost as cool as this guy:

  7. Why should I use it? • It’s fashionable • Your salary increase is directly tied to how often you use it • It encapsulates and simplifies some of the most common JavaScript and Ajax tasks • It’s lightweight, logical, and extensible • It plays well with others; in fact, other frameworks invite it over for play dates

  8. Disturbing photo

  9. I am going to eat your children More features • Basic animation fadeIn(), fadeOut(), slideUp(), show(speed) • Powerful DOM traversing / manipulation clone(), wrap(), append(), insertAfter() • Integrated with ASP.NET MVC (IntelliSense library available) • Powerful and actively developed plugin library • Client-side date pickers, grids, sorting/filtering, common UI niceties (lightbox, blocking bg) Note to self: show everyone the jQueryquickSearch thing, and mock it for its lack of cross-browser compatibility

  10. FlexBox • ComboBox, Google Suggest, Type-ahead • Hosted on CodePlex • http://www.fairwaytech.com/flexbox

  11. Feed the CEO • That’s Chief Eating Obsessor