Tuesday, August 19, 2008

JQuery - Getting Started


// Makes an element visible which has the id 'mydiv'
$("#mydiv").show();

// Makes each odd tr element to have a blue backcolor
$("tr:odd").css("background-color", "blue");


// What if we want to make the header row have a different look ? Show Me
$("#results tr:first").css("background", "black");
$("#results tr:first").css("color", "white");
$("#results tr:first").css("font-weight", "bold");


// We also could have assigned a class name to the header tr element like this
$("#results tr:first").addClass("header");


//All span that are inside a div element (may not be immediate child of the div) will be selected.
$("div span").css("border", "1px solid");

//Here is how we select the links that are descendent of span which are direct children of a div
$("div > span a")

//Here is how we can select a div with id mydiv
$("div#mydiv")


// Here is how we select all links under div elements that have css class set to mycss
$("div.mycss a")

// if we want to find a link that points to http://www.google.com then we would write
$("a[href=http://www.google.com]")


// Modifications
$("body").prepend("");
$("div#mydialog").html("

Hi There!

");
$("#mytable").wrap("
");


// How to replace all hr elements (horizontal line) with a br element
$("
").replaceAll("hr");


Reference : http://www.shafqatahmed.com/2008/08/mybutton-font-f.html