Posted by: Syed Abdul Baqi on: December 27, 2009
jQuery is a JavaScript framework library, which makes the life of the web developer easier. In this tutorial I will focus on the implementation and uses of jQuery selectors. jQuery follows CSS style of referring to an element. Now I will try to give some list of examples below, which illustrates jQuery referring different kinds of elements.
HTML Code:
<div id="myDiv">Hello-1</div> <div class="myDiv">Hello-2</div> <div id="parentDiv"><div id="childDiv">Hello-3</div></div> <div class="myDiv">Hello-4</div> <div></div>
jQuery Code:
1. $("#myDiv")[0].innerHTML; returns "Hello-1"
2. $(".myDiv")[0].innerHTML; returns "Hello-2"
3. $("#childDiv")[0].innerHTML; returns "Hello-3"
4. $("#parentDiv > div")[0].innerHTML; returns "Hello-3"
5. $(".myDiv")[1].innerHTML; returns "Hello-4"
6. $("div")[0].innerHTML; returns "Hello-1"
These are just few basics examples for jQuery selector. There are many more ways in which the selectors can be used for accessing HTML elements. I will try to add more as I get time.
Comments are welcomed….
Recent Comments