Click here to check my latest exciting videos on youtube
Search Mallstuffs

Flag Counter
Spirituality, Knowledge and Entertainment


Locations of visitors to this page


Latest Articles


Move to top
Select Groups of similar elements using position selector
Posted By Sarin on Jul 15, 2012     RSS Feeds     Latest Hinduism news
2469 Views

Using this type of selector, we can narrow the search of our selection and can apply specific actions on only this selected elements.
For our demo purpose let us defined four strong element and seven buttons for each type of position type selectors
  
  <strong>Hare Krishna</strong><br />
<strong>Krishna Krishna</strong><br />
<strong>Hare Rama</strong><br />
<strong>Rama Rama</strong><br />

Different position type selector methods are a follow:

✓ :first: This selects the first matching element. This code alert the user with text of first strong element
  
alert($('strong:first').text());
  
✓ :last: this selects the last matching element. This code alert the user with text of last strong element

alert($('strong:last).text());
  
  
✓ :even: this selects the elements at even position i.e. 0, 2 ,4. This code alert the user with text of even positioned strong element. Since, the index of html elements starts with 0, first (index 0) and third (index 2) strong elements are shown.

alert($('strong:even).text());
  
  
✓: odd: selects the elements at even position i.e. 1, 3, 5. this code alerts the user with text of odd positioned strong element. Since, the index of html elements starts with 0, second (index 1) and fourth (index 3) strong elements are shown.
  
alert ($('strong:odd).text());
  

✓: eq(index): select the element with an index value equal to index specified in function. This code alerts the user with text of strong element positioned at index 2. Since, the index of html elements starts with 0, third strong element is shown.
  
alert($('strong:eq(2)').text());
  
  
 ✓ :gt(index): Selects all elements with an index value greater than the index specified in function. This code alerts the user with text of strong element positioned at index greater than 2. Since, the index of html elements starts with 0, fourth(index 3) strong element is shown.
  
alert($('strong:gt(2)').text());


  
✓ :lt(index): Selects all elements with an index value less than the index specified in function. This code alerts the user with text of strong element positioned at index less than 2. Since, the index of html elements starts with 0, first(index 0) and second(index 1) strong elements are shown.

alert($('strong:lt(2)').text());



here


Share this to your friends. One of your friend is waiting for your share.
Share on Google+ Share on Tumblr Print Browser Favorite
Related Articles
Get Set Value of any HTML element using jquery-Val function
Select Parent, Child, sibling,descendants HTML element using jquery
Ge the total number of HTML elements in a page
Creating your first application in JQuery
Appending Html elements or contents dynamically
Changing CSS Properties of HTML element using JQuery
Jquery features, Advantages and disadvantages
Call JavaScript functions from silverlight
Select Groups of similar elements using position selector
Working with server controls and HMTL controls

Post Comment