jQuery Interview Questions with answers and demo - Selectors



Q :- How to use ID selector with jQuery ?
Ans : $("#id").css('color','red');

Demo 


Q :- How to use class selector with jQuery ?

Ans : $(".class").css('color','red');

Demo


Q :- How to use element selector with jQuery ?

Ans : $("p").css('color','red');

Demo


Q :- How to select elements with two classes ?

Ans :- $(".class1.class2").css('color','red');


Q :- How to select all anchor tags having href attribute ?

Ans :- We can use attribute selector of jQuery.

   $("[href]").css('color','red');


Demo


Q :- How to select anchor tag with href attribute value set to Word.html ?

Ans : We can use Attribute Value selector. This selector selects the elements on page with specified attribute value.

    $("[href = 'world.html']").css('color','red');


Demo


Q :- How to select all paragraph elements having text 'hello' in it ?

Ans : We can use element selector to select all the paragraph elements ans the can use contains selector to filter paragraph elements with specified text.

 $("p:contains('hello')").css('color','red')


Demo


Q :- How to select checked checkboxes from the page ?

Ans : $(":checked")

Demo


Q :- How to select third li element from the list of 10 li elements ?

Ans : We can use equal selector. 
      $("ul li:eq(2)").css('color','red')
      The index start from 0.

Demo 


Q :- How to select even tr's of table ?

Ans : $("tr:even").css('color','red')
      or for selecting even paragraph elements we can use : 
      $("tr:even").css('color','red')

Demo



Q :- How to select odd tr's of table ?

Ans : $("tr:odd").css('color','red')
      or for selecting odd paragraph elements we can use : 
      $("tr:odd").css('color','red')

Demo



Q :- How to select first paragraph element on the page ?

Ans : $('p:first').css('color','red')

Demo


Q :- How to select last div element on the page ?

Ans : $('div:last').css('color','red')

Demo


Q :- How to select all li elements with position or index greater than 2 ?

Ans : $("ul li:gt(2)").css('color','red')

Demo 


Q :- How to select all li elements with position or index less than 2 ?

Ans : $("ul li:lt(2)").css('color','red')

Demo


Q :- How to select all p elements on page except first ?

Ans : $("p :not(:first)").css('color','red')

Demo






0 comments:

Post a Comment