In this tutorial we are providing some set of jQuery Interview Questions with answers and explanation for freshers and professionals, which will help to prepare for technical interviews.
-
What is jQuery?
jQuery is not a programming language but a well written JavaScript code. It is a JavaScript code, which do document traversing, event handling, Ajax interactions and Animations.
-
Whether jQuery HTML work for both HTML and XML documents?
No, jQuery HTML only works for HTML documents not for XML Documents.
-
What are the methods used to provide effects?
Some of the effects methods are:
Show()
Hide()
Toggle()
FadeIn() and
FadeOut() -
What is jQuery Selectors? Give some examples.
1. jQuery Selectors are used to select one or a group of HTML elements from your web page.
2. jQuery support all the CSS selectors as well as many additional custom selectors.
3. jQuery selectors always start with dollar sign and parentheses: $().
4. There are three building blocks to select the elements in a web document.1) Select elements by tag name
Example : $(div)
It will select all the div elements in the document.2) Select elements by ID
Example : $(“#someid”)
It will select single element that has an ID of someid.3) Select elements by class
Example : $(“.someclass”)
It will select all the elements having class someclass. -
Why jQuery is needed?
jQuery is needed for the following list:
Used to develop browser compatible web applications
Improve the performance of an application
UI related functions are written in minimal lines of codes. -
What is difference between $(this) and ‘this’ in jQuery?
Refer the following example:
$(document).ready(function() { $('#clickme').click(function() { alert($(this).text()); alert(this.innerText); }); });– this and $(this) references the same element but the difference is that “this” is used in traditional way but when “this” is used with $() then it becomes a jQuery object on which we can use the functions of jQuery.
– In the example given, when only “this” keyword is used then we can use the jQuery text() function to get the text of the element, because it is not jQuery object. Once the “this” keyword is wrapped in $() then we can use the jQuery function text() to get the text of the element. -
What is the advantage of using minimized version of jQuery?
Efficiency of web page increases when minimized version of jQuery is used.min.js file will be more than 50% less than the normal js file. Reduction in the file size makes the web page faster.
-
Is jQuery is a JavaScript or JSON library file?
jQuery is a library of JavaScript file and it consists of DOM, event effects and the Ajax functions. jQuery is said to be a single JavaScript file.
-
What is the difference between find and children methods?
Find method is used to find all levels down the DOM tree but children find single level down the DOM tree.
-
What is the use of param() method.
1. The param() method is used to represent an array or an object in serialize manner.
2. While making an ajax request we can use these serialize values in the query strings of URL.
3. Syntax: $.param(object | array, boolValue)
4. “object | array” specifies an array or an object to be serialized.
5. “boolValue” specifies whether to use the traditional style of param serialization or not.For example:
personObj = new Object(); empObject.name="Ayush"; empObject.age="26"; empObject.dept="Account"; $("#clickme").click(function() { $("span").text($.param(empObject)); });It will set the text of span to “name=Ayush&age=26&dep=Account”
-
What are the features of jQuery, has been used in web applications?
jQuery uses features like Sliding, File uploading and accordian in web applications.
-
What is the use jQuery.data method?
jQuery.data methods is used to associate the data with the DOM nodes and the objects. This data method makes the jQuery code clear and concise.
-
What is the use of each function in jQuery?
Each function is used to iterate each and every element of an object. It is used to loop DOM elements, arrays and the object properties.
-
What is the difference between size and length of jQuery?
Size and length both returns the number of element in an object. But length is faster than the size because length is a property and size is a method.
-
Can we add more than one ‘document.ready’ function in a page?
Yes, we can add more than one document.ready function in a page. But, body.onload can be added once in a page.
-
What is the use of jQuery load method?
jQuery load method is a powerful AJAX method which is used to load the data from a server and assign the data into the element without loading the page.
-
Whether our own specific characters are used in place of $ in jQuery?
Yes, we can use our own variable in place of $ by using the method called no Conflict () method.
var sam = $.noConflict()Explain .empty() vs .remove() vs .detach().
– .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() method is same as .remove() method except that the .detach() method doesnβt remove jQuery data associated with the matched elements.
– .remove() is faster than .empty() or .detach() method.Syntax:
$(selector).empty(); $(selector).remove(); $(selector).detach();
-
Is window.onload is different from document.ready()?
– The window.onload() is Java script function and document.ready() is jQuery event which are called when page is loaded.
– The difference is that document.ready() is called after the DOM is loaded without waiting for all the contents to get loaded. While window.onload() function waits until the contents of page is loaded.
– Suppose there is very large image on a page, at that time window.onload() will wait until that image is loaded totally.
– So while using the window.onlaod() function the execution will be slow, but the document.ready() will not wait until the image is loaded. -
What is difference between prop and attr?
1. In jQuery both prop() and attr() function is used to set/get the value of specified property of an element.
2. The difference in both the function is that attr() returns the default value of the property while the prop() returns the current value of the property.For example
<input value="My Value" type="text"/> $('input').prop('value', 'Changed Value'); - .attr('value') will return 'My Value' - .prop('value') will return 'Changed Value' -
What are the four parameters used for jQuery Ajax method?
The four parameters are
URL β Need to specify the URL to send the request
type β Specifies type of request(Get or Post)
data β Specifies data to be sent to server
Cache β Whether the browser should cache the requested page -
What is the use of jQuery filter?
The jQuery filter is used to filter the certain values from the object list based on the criteria. Example is to filter certain products from the master list of products in a cart website.
-
Which sign is used as a shortcut for jQuery?
Dollar ($) sign is used as a shortcut for jQuery.
-
Is jQuery is a client or server scripting?
jQuery is a client scripting.
-
What is the script build up by jQuery?
jQuery is a Javascript file and it is single javascript file that contains common DOM, event effects and Ajax functions.
-
How can we debug jQuery?
There are two ways to debug jQuery:
Debugger keyword
Add the debugger to the line from where we have to start debugging and then run Visual Studio in Debug mode with F5 function key.
Insert a break point after attaching the process. -
What is resize() function in jQuery?
The resize() function is called whenever the browser size is changed. This event can be only used with $(window).
Syntax:
.resize([event_data], handler(event_object))
– The “event_data” is the data to be sent to the handler.
– The “handler(event_object)” is a function to be called each time when the window is resized.For example
$(window).resize(function() { $('#message).text('window is resized to ' + $(window).width() + 'x' + $(window).height()); });
