Syed Abdul Baqi

Archive for the ‘jquery’ Category

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>

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….