JQuery Interview Questions

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.

Why jQuery is needed?

jQuery is needed for the following list:

  • Used to develop browser compatible web applications
  • Improve the performance of an application
  • Very fast and extensible
  • UI related functions are written in minimal lines of codes

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 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.

Which operating system is more compatible with jQuery?

Mac, Windows and Linux are more compatible with the jQuery.

Which command will give a version of jQuery?

The command $.ui.version returns jQuery UI version.

In what scenarios jQuery can be used?

jQuery can be used in following scenarios:

  • Apply CSS static or dynamic
  • Calling functions on events
  • Manipulation purpose
  • Mainly for Animation effects

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 jQuery connect?

A ‘ jQuery connect’  is a plugin used to connect or bind a function with another  function. Connect is used to execute function from any other function or plugin is executed.

How to use connect?

Connect can be used by downloading jQuery connect file from jQuery.com and then include that file in the HTML file. Use $.connect function to connect a function to another function.

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 are the browser related issues for jQuery?

Browser compatibility of jQuery plugin is an issue and needs lot of time to fix it.

Whether we need to add jQuery file in both Master and Content page?

jQuery file should be added to the Master page and can use access from the content page directly without having any reference to it.

What are the basic selectors in jQuery?

Following are the basic selectors in jQuery:

  • Element ID
  • CSS Name
  • Tag Name
  • DOM hierarchy

Can we call C# code behind using jQuery?

Yes, we can call C# code from jQuery as it supports .net application.

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 sample = $.noConflict()

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 program is useful for testing jQuery?

QUnit is used to test jQuery and it is very easy and efficient.

What is CDN?

CDN is abbreviated as Content Distribution network and it is said to be a group of companies in different location with network containing copies of data files to maximize bandwidth in accessing the data.

What are the two types of CDNs?

There are two types of CDNs:

  • Microsoft – Load jQuery from Ajax CDN
  • Google – Load jQuery from Google libraries API

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 are all the ways to include jQuery in a page?

Following are the ways to include jQuery in a page:

  • Local copy inside script tag
  • Remote copy of jQuery.com
  • Remote copy of Ajax API
  • Local copy of script manager control
  • Embedded script using client script object

What is the use of jQuery.ajax method ()?

jQuery.ajax method is used for asynchronous HTTP requests.

Where can we download JQuery?

jQuery javascript can be downloaded from jQuery official website – www.jquery.com

Is jQuery is a replacement of JavaScript?

No, jQuery is not a replacement of JavaScript.

What is called chaining?

Chaining is used to connect multiple events and functions in a selector.

What are the advantages of jQuery?

Following are the advantages of jQuery:

  • Just a JavaScript enhancement
  • Coding is simple, clear, reusable
  • Removal of writing more complex conditions and loops

Whether C# code behind can be called from jQuery?

Yes, we can call C# code behind from jQuery.

What is the use of jQuery.data() method?

jQuery data method is used to associate data with DOM nodes and JavaScript objects. This method will make a code very concise and neat.

What is the difference between onload() and document.ready()?

In a page, we can have only one onload function but we can have more than one document.ready function. Document.ready function is called when DOM is loaded but onload function is called when DOM and images are loaded on the page.

What is the use of jQuery each function?

jQuery each function is used to loop through each and every element of the target jQuery object. It is also useful for multi element DOM, looping arrays and object properties.

How method can be called inside code behind using jQuery?

$.ajax can be called and by declaring WebMethod inside code behind using jQuery.

Which is the fastest selector in jQuery?

ID and Element are the fastest selectors in jQuery.

What is the slowest selector in jQuery?

Class seectors are the slowest selectors in jQuery.

Where jQuery code is getting executed?

jQuery code is getting executed on a client browser.

What is the method used to define the specific character in place of $ sign?

‘NoConflict’ method is used to reference a jQuery and save it in a variable. That variable can be used instead of Sign.

Why jQuery is better than JavaScript?

jQuery is a library used for developing Ajax application and it helps to write the code clean and concise. It also handles events, animation and Ajax support applications.

What are the types of selectors in jQuery?

There are three types of selectors in jQuery:

  • CSS Selector
  • XPath Selector
  • Custom Selector

How can we include jQuery library in ASP.Net project?

Download the jQuery library from jQuery.com and include that reference in the asp.net page.

What are the core features of jQuery?

Following is the list of important core features supported by jQuery −

  • DOM manipulation − The jQuery made it easy to select DOM elements, traverse them and modifying their content by using cross-browser open source selector engine called Sizzle.
  • Event handling − The jQuery offers an elegant way to capture a wide variety of events, such as a user clicking on a link, without the need to clutter the HTML code itself with event handlers.
  • AJAX Support − The jQuery helps you a lot to develop a responsive and feature-rich site using AJAX technology.
  • Animations − The jQuery comes with plenty of built-in animation effects which you can use in your websites.
  • Lightweight − The jQuery is very lightweight library – about 19KB in size ( Minified and gzipped ).
  • Cross Browser Support − The jQuery has cross-browser support, and works well in IE 6.0+, FF 2.0+, Safari 3.0+, Chrome and Opera 9.0+.
  • Latest Technology − The jQuery supports CSS3 selectors and basic XPath syntax.

How will you make sure that DOM is ready using jQuery?

Use $(document).ready() function. Everything inside it will load as soon as the DOM is loaded and before the page contents are loaded.

How can you create an Object in JavaScript?

JavaScript supports Object concept very well. You can create an object using the object literal as follows −

var emp = {
   name: "Zara",
   age: 10
};

How can you read properties of an Object in JavaScript?

You can write and read properties of an object using the dot notation as follows −

// Getting object properties
emp.name  // ==> Zara
emp.age   // ==> 10

// Setting object properties
emp.name = "Daisy"  // <== Daisy
emp.age  =  20      // <== 20

How can you create an Array in JavaScript?

You can define arrays using the array literal as follows −

var x = [];
var y = [1, 2, 3, 4, 5];

How to read elements of an array in JavaScript?

An array has a length property that is useful for iteration. We can read elements of an array as follows −

var x = [1, 2, 3, 4, 5];

for (var i = 0; i < x.length; i++) {
   // Do something with x[i]
}

What is a named function in JavaScript? How to define a named function?

A named function has a name when it is defined. A named function can be defined using function keyword as follows −

function named(){
   // do some stuff here
}

How to define a anonymous function?

An anonymous function can be defined in similar way as a normal function but it would not have any name.

Can you assign a anonymous function to a variable?

Yes! An anonymous function can be assigned to a variable.

Can you pass a anonymous function as an argument to another function?

Yes! An anonymous function can be passed as an argument to another function.

What is arguments object in JavaScript?

JavaScript variable arguments represents the arguments passed to a function.

How can you get the type of arguments passed to a function?

Using typeof operator, we can get the type of arguments passed to a function. For example −

function func(x){
   console.log(typeof x, arguments.length);
}

func();                //==> "undefined", 0
func(1);               //==> "number", 1
func("1", "2", "3");   //==> "string", 3

How can you get the total number of arguments passed to a function?

Using arguments.length property, we can get the total number of arguments passed to a function. For example −

function func(x){
   console.log(typeof x, arguments.length);
}

func();                //==> "undefined", 0
func(1);               //==> "number", 1
func("1", "2", "3");   //==> "string", 3

How can you get the reference of a caller function inside a function?

The arguments object has a callee property, which refers to the function you’re inside of. For example −

function func() {
   return arguments.callee; 
}

func();                // ==> func

What is the purpose of 'this' operator in JavaScript?

JavaScript famous keyword this always refers to the current context.

What are the valid scopes of a variable in JavaScript?

The scope of a variable is the region of your program in which it is defined. JavaScript variable will have only two scopes.

  • Global Variables − A global variable has global scope which means it is visible everywhere in your JavaScript code.
  • Local Variables − A local variable will be visible only within a function where it is defined. Function parameters are always local to that function.

Which type of variable among global and local, takes precedence over other if names are same?

A local variable takes precedence over a global variable with the same name.

What is callback?

A callback is a plain JavaScript function passed to some method as an argument or option. Some callbacks are just events, called to give the user a chance to react when a certain state is triggered.

What is closure?

Closures are created whenever a variable that is defined outside the current scope is accessed from within some inner scope.

Give an example of closure?

Following example shows how the variable counter is visible within the create, increment, and print functions, but not outside of them −

function create() {
   var counter = 0;

   return {
      increment: function() {
         counter++;
      },

      print: function() {
         console.log(counter);
      }
   }
}

var c = create();
c.increment();
c.print();     // ==> 1

Which built-in method returns the character at the specified index?

charAt() method returns the character at the specified index.

Which built-in method combines the text of two strings and returns a new string?

concat() method returns the character at the specified index.

Which built-in method calls a function for each element in the array?

forEach() method calls a function for each element in the array.

Which built-in method returns the index within the calling String object of the first occurrence of the specified value?

indexOf() method returns the index within the calling String object of the first occurrence of the specified value, or −1 if not found.

Which built-in method returns the length of the string?

length() method returns the length of the string.

Which built-in method removes the last element from an array and returns that element?

pop() method removes the last element from an array and returns that element.

Which built-in method adds one or more elements to the end of an array and returns the new length of the array?

push() method adds one or more elements to the end of an array and returns the new length of the array.

Which built-in method reverses the order of the elements of an array?

reverse() method reverses the order of the elements of an array — the first becomes the last, and the last becomes the first.

Which built-in method sorts the elements of an array?

sort() method sorts the elements of an array.

Which built-in method returns the characters in a string beginning at the specified location?

substr() method returns the characters in a string beginning at the specified location through the specified number of characters.

Which built-in method returns the calling string value converted to lower case?

toLowerCase() method returns the calling string value converted to lower case.

Which built-in method returns the calling string value converted to upper case?

toUpperCase() method returns the calling string value converted to upper case.

Which built-in method returns the string representation of the number's value?

toString() method returns the string representation of the number’s value.

What is a jQuery selector?

A jQuery Selector is a function which makes use of expressions to find out matching elements from a DOM based on the given criteria. Simply you can say, selectors are used to select one or more HTML elements using jQuery. Once an element is selected then we can perform various operations on that selected element. jQuery selectors start with the dollar sign and parentheses – $().

How to resolve confict with another JavaScript library if $ is already being in use?

The factory function $() is a synonym of jQuery() function. So in case you are using any other JavaScript library where $ sign is conflicting with some thing else then you can replace $ sign by jQuery name and you can use function jQuery() instead of $().

How to select elements using jQuery with the given element tag-name?

$(‘tag-name’) selects all element of type tag-name in the document. For example, $(‘p’) selects all paragraphs <p> in the document.

How to select single element using jQuery with the given element id some-id?

$(‘#some-id’) selects the single element in the document that has an ID of some-id.

How to select elements using jQuery whose css class is some-class?

$(‘.some-class’) selects all elements in the document that have a class of some-class.

How to select all elements using jQuery?

$(‘*’) selects all elements available in a DOM.

How to select multiple elements using jQuery?

$(‘E, F, G’) selects the combined results of all the specified selectors E, F or G where selectors can be any valid jQuery selector.

How to get attributes of an element using jQuery?

The attr() method can be used to fetch the value of an attribute from the first element in the matched set.

How to set attributes of an element using jQuery?

The attr(name, value) method can be used to set the named attribute onto all elements in the wrapped set using the passed value.

How can you apply a style on an element using jQuery?

The addClass( classes ) method can be used to apply defined style sheets onto all the matched elements. You can specify multiple classes separated by space.

How to remove an attribute from each of the matched elements using jQuery?

The removeAttr( name ) method can be used to remove an attribute from each of the matched elements.

How to know if a specified class is present on at least one of the set of matched elements using jQuery?

The hasClass( class ) method returns true if the specified class is present on at least one of the set of matched elements.

How to remove all or the specified class(es) from the set of matched elements using jQuery?

The removeClass(class) method remove all or the specified class(es) from the set of matched elements.

How to add the specified class if it is not present, remove the specified class if it is present using jQuery?

The toggleClass(class) method adds the specified class if it is not present, removes the specified class if it is present.

How to get the html contents (innerHTML) of an element using jQuery?

The html() method gets the html contents (innerHTML) of the first matched element

How to set the html contents of an element using jQuery?

The html( val ) method sets the html contents of every matched element.

How to get the text contents of an element using jQuery?

The text( ) method gets the combined text contents of all matched elements.

How to set the text contents of an element using jQuery?

The text( val ) sets the text contents of all matched elements.

How to get the input value of an element using jQuery?

The val( ) method gets the input value of the first matched element.

How to set the value of an element using jQuery?

The val(val) method sets the value attribute of every matched element if it is called on <input> but if it is called on <select> with the passed <option> value then passed option would be selected, if it is called on check box or radio box then all the matching check box and radiobox would be checked.

How to filter out elements from a set of matched elements using jQuery?

The filter( selector ) method can be used to filter out all elements from the set of matched elements that do not match the specified selector(s). The selector can be written using any selector syntax.

Summary
Review Date
Reviewed Item
Thank you for sharing JQuery Interview Questions and Answers, Keep Updating. Thank You Once again.
Author Rating
51star1star1star1star1star