jquery rescue adventure · 32 | sharepoint saturday columbus 2011 jquery scottgu: jquery and...
TRANSCRIPT
jQuery Rescue Adventure
3 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
▪
4 | SharePoint Saturday Columbus 2011
jQuery is a new kind of JavaScript Library.
5 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
▪
▪
▪
6 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
▪
7 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
8 | SharePoint Saturday Columbus 2011
10 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
▪
▪
▪
▪
11 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
▪
12 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
▪
▪
13 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
▪
▪
14 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
▪
▪
▪
▪
▪
▪
▪
▪
15 | SharePoint Saturday Columbus 2011
16 | SharePoint Saturday Columbus 2011
http://api.jquery.com/browser/
▪
▪
17 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
▪
▪
▪
▪
18 | SharePoint Saturday Columbus 2011
Description Selector
Equals Or Starts With Followed by Hyphen [name|=“value”]
Contains Text [name*=“value”]
Contains Word Delimited by Spaces [name~=“value”]
Ends With [name$=“value”]
Starts With [name^=“value”]
Equals [name=“value”]
Not Equals [name!=“value”]
Has Attribute [name]
Multiple Attributes [name=“value”][name2=“value2”]
19 | SharePoint Saturday Columbus 2011
Description Selector
Currently Animating :animated
Element at Given Index :eq()
Even or Odd Elements in Results :even, :odd
First or Last Element in Result :first, :last
Currently Focused :focus
Greater Or Less than Given Index :gt(), :lt()
Header Elements :header
Elements That Do Not Match :not()
First or Last Child :first-child, :last-child
Child at Given Index :nth-child()
Only Children :only-child
20 | SharePoint Saturday Columbus 2011
Description Selector
Contains Content (case-sensitive) :contains()
Empty Element :empty
Has An Element :has()
Parent Elements :parent
21 | SharePoint Saturday Columbus 2011
22 | SharePoint Saturday Columbus 2011
Description Method
Adding, Removing, Toggling CSS Classes addClass(), removeClass(), toggleClass()
Adding Content .after(), .insertAfter(), .before(), .insertBefore(), .append(), .appendTo(), .prepend(), .prependTo()
Reading and Setting Attributes .attr(“name”), .attr(“name”, “value”),.attr({“name1”: “value1”, “name2”: “value2”})
Reading and Setting CSS Styles .css(“name”), .css(“name”, “value”), .css({“name1”: “value1”, “name2”: “value2”})
Reading and Setting Form Values .val(), .val(“newvalue”)
Reading and Setting Text .text(), .text(“newvalue”)
Reading and Setting HTML .html(), .html(“<strong>newvalue</strong>”)
Wrapping Elements .wrap(), .wrapAll(), .wrapInner()
Removing Elements .remove(), .empty(), .detach(), .unwrap()
23 | SharePoint Saturday Columbus 2011
24 | SharePoint Saturday Columbus 2011
Description Method
Loop through all items .each()
Add Elements to Current Results .add()
Filter Results .filter()
Filter Descendants .find()
Map to a New Result .map()
Children Selector .children()
Parent Selectors .parent(), .offsetParent(), .parentsUntil()
Sibling Selectors .siblings(), .next(), .prev(), .nextUntil(), .prevUntil()
25 | SharePoint Saturday Columbus 2011
26 | SharePoint Saturday Columbus 2011
Description Method
Generic Bind .bind(“method”, function() { })
Bind Event Once .one(“method”, function() { })
Bind Shortcuts .click(), .change(), .select(), .mouseover(), .mouseout(), .blur()
Hover (Mouseover and Mouseout) .hover(function() { }, function() { })
Trigger Event .trigger(“method”)
27 | SharePoint Saturday Columbus 2011
28 | SharePoint Saturday Columbus 2011
Browser Description
Firefox FirebugConsole WindowHTML, CSS, JavaScript
Internet Explorer Developer ToolbarConsole WindowHTML, CSS, JavaScript
29 | SharePoint Saturday Columbus 2011
30 | SharePoint Saturday Columbus 2011
▪
▪
▪
▪
31 | SharePoint Saturday Columbus 2011
32 | SharePoint Saturday Columbus 2011
▪ jQuery
▪ ScottGu: jQuery and Microsoft
▪ Jon Galloway: Using CDN Hosted jQuery with a Local Fall-back Copy
▪ Find External Links with jQuery
▪ jQuerify
▪ SlideDeck
33 | SharePoint Saturday Columbus 2011
▪
▪
▪
Thanks to Our Sponsors!