TOP-10 Interview Questions in jQuery for Advanced Programmers

1. Explain the effects method in jQuery.

The effects method in jquery is used to add effects to a web page. Hence, the effects that can be added to a web page are fading, hiding and showing, animation and sliding. Many different methods can be used to put effects on a web page using jQuery. The effects that can be used are as follows:

show(): The show effect is used to show specific elements on the webpage.

Hide (): The hide method is used to hide specific elements on the webpage. Show and Hide can be used together to create a list that shows or hides on the command of the visitor.

FadeOut (): The fadeout method is used to fade one set of selected elements into the other elements. It can also be used to fade the marked elements into nothingness or become transparent.

Toggle (): the toggle method is used to bring the elements of the hide and show together. So, if you want to hide an element and then show it, you will need to use the toggle in it to bring the desired effect.

FadeIn(): If you wish to fade a specific element into opaqueness, you will need to use the fade-in method in jQuery.

2. Specify the selectors in jQuery and mention their types.

Selectors help find or select an HTML element on a web page that you wish to work with using jQuery. A few basic selectors are:

Name: The simplest selector to use; the name selector helps find and select an element just by using and matching with its given element Name.

Class: The class selector is used when you need to find and select all the elements and match them with the given Class.

Universal (*): If you need to select all the elements that are present in a DOM, the Universal selector is used.

Attribute selector: If you need to select an element based on their attribute value, the attribute selector is used.

#ID: The ID selector only finds and selects with the single element that matches with the given ID.

3. Explain the Clone method with an example.

The Clone method in jQuery is used to make clones of the set of controls. Thus, it copies the set of elements selected and then matches them using the selectors. It copies both the descendant elements and the parent elements.

An example of the clone method is:

$(document).ready(function(){
$('#mycontrolid').click(function(){
$('#mycontrolid').clone().appendTo('body');
return false;
});
});

4. How do .empty(), .remove() and .detach() differ from each other?

.remove(): The remove () is used to remove an element along with its all child elements. After using the remove, data from DOM can be restored but not from vent handlers.

.empty(): The empty () keeps the element concerned but targets its content and the content of its child elements and removes them.

.detach(): The detach () aims to remove the element along with all its child elements. However, it does not remove the data and the event handlers concerned with those elements.

5. List down the advantages of jQuery as compared to Javascript In Asp.net web application.

The advantages are as follows:

• jQuery is written in such a way that the Javascript code executes faster as compared to any standard optimized Javascript code.
• Javascript development is always faster using jQuery because some functionality code is already available and only needs to be fetched from the library and used.
• jQuery is a highly brief Javascript code. Hence, only minimal code needs to be written for the same functionality as some other standard JavaScript code.
• jQuery comes with cross-browser support, and hence, all browsers can be accessed with this code.

6. What are the Ajax functions in jQuery?

.ajaxStart(): This Ajax function is used to register the handler that is needed to be called at the time of the first Ajax request.

.ajaxStop(): This Ajax function is used to register the handler that is needed to be called at the time of the completion of an Ajax request.

.ajaxSuccess(): This Ajax function is used to register the handler that is called at the time of an Ajax request being completed.

7. Differentiate between the bind(), live() and delegate() methods in jQuery.

• bind(): The bind method is used to register the event handler directly to the DOM element required. An example is :

$(“#members a”).bind(“click”, function(f){….});

Hence, the event handler will be bound to any of the matching anchors.

• live(): The live method is used to attach the event holder to the root of a given document. Hence, only one handler needs to be used for all events created by the root. The handler is thus attached only once in a given place.
• delegate(): The delegate method is used to choose where you wish to attach the handler. Hence, this makes it the most efficient method for delegation in the code. An example is:

$(“#members”).delegate(“ul li a”, “click”, function(f){….});

8. Mention the advantage of using document.ready functions in jQuery.

The $(document).ready(function (), when used in JQuery, ensures that the code inside this given function executes only upon the loading of the full page. Hence, no error will be shown.

9. What is the slide toggle method in jQuery?

The slide toggle method in jQuery is used to give animation effects on a web page to the selected elements. The method is used along with the following parameters:

Speed: The speed parameter is used to specify the speed of the animation effect relating to how fast the slide will toggle on the webpage. This is an optional parameter.

Easing: Easing is again an optional parameter and is used to specify the speed of the toggling of the slide but at different intervals of time during the animated effect.

Callback: The callback parameter is used after the slide toggle method is completed. Hence, upon using the callback parameter, the callback function is accepted and executed. It is also an optional parameter.

10. Mention the four parameters for the Ajax method in jQuery.

The parameters are as follows:

1. URL: The parameter is for the URL to send the request.
2. Type: The parameter is used for GET/POST requests.
3. Success: This parameter is for a callback function for when the request is successful.
4. DataType: The parameter is used to return data type – HTML, XML, text, etc.

   

About the Author

ByteScout Team of Writers ByteScout has a team of professional writers proficient in different technical topics. We select the best writers to cover interesting and trending topics for our readers. We love developers and we hope our articles help you learn about programming and programmers.