jQuery, Events, and The DOM


jQuery, Events, and The DOM

jQuery was created in 2006 by John Resig. It was designed to handle Browser Incompatibilities and to simplify HTML DOM Manipulation, Event Handling, Animations, and Ajax.

Finding HTML Element

Return the element with id=”id01”:

var myElement = $("#id01");

Return all <p> elements:

var myElements = $("p");

Return all elements with class=”intro”.

var myElements = $(".intro");

Return a list of all <p> elements with class=”intro”.

var myElements = $("p.intro");

get,set HTML

Set Text Content Set the inner text of an HTML element:

myElement.text("Hello Sweden!");

Get Text Content

var myText = myElement.text();

Set HTML Content

var myElement.html("<p>Hello World</p>");

Get HTML Content

var content = myElement.html();

CSS Styles

Hiding /showing HTML Elements

myElement.hide();
myElement.show();

Styling HTML Elements

myElement.css("font-size","35px");

HTML DOM

Removing Elements

$("#id").remove();

Get Parent Element

var myParent = myElement.parent();