J query

jQueryCross-browser javascript libraryFree & OpensourceFirst released Jan 06 @Barcamp by John ResigLast stable version 1.4.2

Why jQuery ?Cross-browser compatibilityFast & Small Plug-inLearning curve & DocumentationIntellisense in VS2008-2010Microsoft [Ajax Lib & MVC]

Who’s using jQueryMicrosoftGoogleMozilladiggWordpress & DrupalHP - IBM - Intel.Ruby on Rails

Getting StartDownload jQuery at jquery.com<script type="text/javascript" src="/js/jQuery. js"></script>Microsoft CDN or Google CDN<script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js" type="text/javascript"></script><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>

Hello world jQueryDocument ready$(document).ready(function () { alert("Hello world jQuery");});// Short cut$(function () { alert("Hello world jQuery");});

jQuery PhilosophyFind someone from HTML(selector)Do something to it(method)

SelectorCSS Style$(“#myID”) // by id$(“.myClass”) // by class name$(“myTag”) // by tag (element name)$(“#id, .class, tag”) // multiple

Selector [Hierarchy]$("form input") // descendant$("#main > *") // child$("#prev ~ div") // sibling

Selector [Hierarchy]$("form input") // descendant<form> <div> Form is surrounded by the green outline</div> <label> Child:</label><input name="name" /> <fieldset> <label> Grandchild:</label><input name="newsletter" /> </fieldset></form>

Selector [Attribute]$("div[id]"). //has$("input[name='bank']“) //not has$("input[name^='news']") //equal$("input[name$='letter']") //begin with$("input[name$='letter']") //end with$("input[name*='man']") //contain$("input[id][name$='man']")

Selector [Form]$("div :text")$("form :radio")$("#dvMainForm :checkbox")$(":button")$("input:disabled")$("input:checked")

Attribute$("em").attr("title")$("label").html()$("p:first").text()$("input").val()Get$("em").attr("title", "zupzip")

EventBind$(“input”).bind(“blur”, fn);Trigger$(“input”).trigger(“focus”);Event Helper$(“input”).click(function() { alert(‘click’); });S(“input”).click();Live$(“input”).live(“click”, fn);

J query

More Related Content

J query