jQuery Interview Questions and Answers

Question: What is jQuery?
Answer: JQuery is JavaScript library which helps to traverse HTML documents. you can do some cool animations and add Ajax interaction to web page. It helps programmer to reduce lines of code of core javascript.

Question: What does dollar Sign ($) means in JQuery?
Answer: $ is an alias of JQuery. See Below

/** Example Number 1 **/
$(document).ready(function(){

});
/** Example Number 1 **/

/** Example Number 2 **/
jQuery(document).ready(function(){
});
/** Example Number 2 **/

Question: How can add margin, in all elements?
Answer:

    $("*").css("margin", "2px");

Question: What are Selectors? Give few Examples.
Answer: jQuery selector are those which help us to select the html element.
Following are some jQuery selectors.

Class (for example $(‘.classname’))
Id (for example $(“#idname”)
Tag name (for example $(“div”))
By attribute (For example $(“input[name=’country’]”));
Custom Attribute

Question: What is .siblings() method in jQuery?
Answer: When we want to fetch siblings of every elements in the set of matched elements then we can use siblings() method.We filter the elements fetched by an optional selector.

Question: What is jQuery unbind?
Answer: The unbind() method removes event handlers from selected elements.

This method can remove all or selected event handlers, or stop specified functions from running when the event occurs.

function alertMe()
{
alert("Hello World!");
}
$(document).ready(function(){
  $("p").click(alertMe);
  $("button").click(function(){
    $("p").unbind("click",alertMe);
  });
});

Question: What is the use of jQuery.data()?
Answer: jQuery.data is used to set/get the multiple values.

Question: Explain bind() vs live() vs delegate() methods.
Answer: The bind() method will not attach events to those elements which are added after DOM is loaded while live() and delegate() methods attach events to the future elements also.
The difference between live() and delegate() methods is live() function will not work in chaining. It will work only on an selector or an element while delegate() method can work in chaining.

Question: Explain the each() function?
Answer: Each function is used to transverse the every element. For example
$("#clickme").click(function(){
$("li").each(function(){
alert($(this).text())
});
});

Question: What is difference between $(this) and ‘this’ in jQuery?
Answer: Both represent to the current object but having the very big difference. “this” is current object of JavaScript and can apply on javascipt functions whereas $(this) is current object wrap with jQuery, can applies jQuery functions on it.

Question: What is the use of param() method?.
Answer: The param() method is used to represent an array or an object in serialize manner. In ajax request we can use these FOR serialize values in the query strings of URL.

Question: Explain .empty() vs .remove() vs .detach().
Answer: empty() method is used to remove all the child elements from matched elements.
remove() method is used to remove all the matched element. This method will remove all the jQuery data associated with the matched element.
detach() This method is the same as .remove(), except that .detach() keeps all jQuery data associated with the removed elements. This method is useful when removed elements are to be reinserted into the DOM at a later time..

Question: Is window.onload is different from document.ready()?
Answer: document.ready() is called when DOM is loaded whereas window.onload() is called when all page content is loaded including js, css & images etc.

Question: What is Chaining in jQuery?
Answer: Multiple functions applies on same object in single line.
$(‘div.abc’).css(‘background-color’,’red’).width(‘100px’).css(‘display’,’block’);
It is concise and fast, as it need not to re-run the object.

Question: What is difference between sorting string array and sorting numerical array in jQuery?
Answer: The sort method is used to sort any array elements. It sorts the string elements alphabetically.
var mylist = [ “Apple”,”Orange”,”Banana”];
mylist = mylist.sort();

Question: What is difference between prop() and attr()?
Answer: Both prop() and attr() function is used to set/get the value of specified property of an element.
Attr return the default value of property where as prop return the current value.

Question: What is event bubbling?
Answer: Event bubbling describes the behavior of events in child and parent nodes in the Document Object Model. that is, all child node events are automatically passed to its parent nodes. The benefit of this method is speed, because the code only needs to traverse the DOM tree once. This is useful when you want to place more than one event listener on a DOM element since you can put just one listener on all of the elements, thus code simplicity and reduction.

Web Technology Experts Notes

Monday, 6 May 2013