jQuery Interview Questions & Answers


What is jQuery?

jQuery is a fast, lightweight, feature-rich client-side JavaScript library. It is cross-platform and supports different types of browsers. It has provided a much-needed boost to JavaScript. Before jQuery, JavaScript codes were lengthy and bigger, even for smaller functions. It makes a website more interactive and attractive.

Is jQuery a programming language?

jQuery is not a programming language but a well-written JavaScript code. It is used to traverse documents, event handling, Ajax interaction, and Animation.

What is the difference between JavaScript and jQuery?

The simple difference is that JavaScript is a language while jQuery is a built-in library built for JavaScript. jQuery simplifies the use of JavaScript language.

Is jQuery replacement of JavaScript?

No, jQuery is not the replacement of JavaScript. jQuery is written on the top of JavaScript, and it is a different library. jQuery is a lightweight JavaScript library which is used to interact with JavaScript and HTML.

Why do we use jQuery?
  • It is very easy to learn and use.
  • It is used to develop browser compatible web applications.
  • It improves the performance of an application.
  • It is very fast and extensible.
  • It facilitates you to write minimal lines of codes for UI related functions.
  • It provides cross-browser support.
What is $() in jQuery library?

The $() function is an alias of jQuery() function. It is used to wrap any object into jQuery object which later facilitates you to call the various method defined jQuery object. You can pass a selector string to $() function, and it returns a jQuery object which contains an array of all matched DOM elements.

Syntax:

        
            $(document).ready(function() { 
            $("p").css("background-color", "pink"); 
            }); 
        
    
What are the effects methods used in jQuery?

These are some effects methods used in jQuery:

  • show() - It displays or shows the selected elements.
  • hide() - It hides the matched or selected elements.
  • toggle() - It shows or hides the matched elements. In other words, it toggles between the hide() and shows() methods.
  • fadeIn() - It shows the matched elements by fading it to opaque. In other words, it fades in the selected elements.
  • fadeOut() - It shows the matched elements by fading it to transparent. In other words, it fades out the selected elements.
What is the use of toggle() method in JQuery?

The jQuery toggle() is a particular type of method which is used to toggle between the hide() and show() method. It shows the hidden elements and hides the shown element.

Syntax:

        
            $(selector).toggle(); 
            $(selector).toggle(speed, callback);
            $(selector).toggle(speed, easing, callback);
            $(selector).toggle(display); 
        
    

speed: It is an optional parameter. It specifies the speed of the delay. Its possible values are slow, fast and milliseconds.

easing: It specifies the easing function to be used for transition.

callback: It is also an optional parameter. It specifies the function to be called after completion of toggle() effect.

display: If true, it displays an element. If false, it hides the element.

What is the purpose of fadeToggle() method in JQuery?

The jQuery fadeToggle() method is used to toggle between the fadeIn() and fadeOut() methods. If the elements are faded in, it makes them faded out, and if they are faded out, it makes them faded in.

Syntax:

        
            $(selector).fadeToggle(); 
            $(selector).fadeToggle(speed,callback); 
            $(selector).fadeToggle(speed, easing, callback); 
        
    

speed: It is an optional parameter. It specifies the speed of the delay. Its possible values are slow, fast and milliseconds.

easing: It specifies the easing function to be used for transition.

callback: It is also an optional parameter. It specifies the function to be called after completion of fadeToggle() effect.

What is the use of delay() method in JQuery?

The jQuery delay() method is used to delay the execution of functions in the queue. It is the best method to make a delay between the queued jQuery effects. The jQUery delay () method sets a timer to delay the execution of the next item in the queue.

Syntax:

        
            $(selector).delay (speed, queueName)    
        
    

speed: It is an optional parameter. It specifies the speed of the delay. Its possible values are slow, fast and milliseconds.

queueName: It is also an optional parameter. It specifies the name of the queue. Its default value is "fx" the standard queue effect.

Is it possible that jQuery HTML work for both HTML and XML document?

No, jQuery HTML only works for HTML document. It doesn't work for XML documents.

What is the use of html() method in JQuery?

The jQuery html() method is used to change the entire content of the selected elements. It replaces the selected element content with new contents.

Syntax:

        
            $(document).ready(function(){ 
                 $("button").click(function(){   
                     $("p").html("Hello Javatpoint.com");  
                 });
            });    
        
    
What is the use of css() method in JQuery?

The jQuery CSS() method is used to get (return)or set style properties or values for selected elements. It facilitates you to get one or more style properties. The jQuery CSS() provides two ways:

Return a CSS property

It is used to get the value of a specified CSS property.

        
            $(document).ready(function(){    
                $("button").click(function(){    
                    alert("Background color = " + $("p").css("background-color"));    
                  });  
            });
        
    

Set a CSS property

This property is used to set a specific value for all matched element.

        
            $(document).ready(function(){    
                 $("button").click(function(){    
                     $("p").css("background-color", "violet");    
                 });
            });  
        
    
Is jQuery library used for server scripting or client scripting?

It is a library for client-side Scripting.

Is jQuery a W3C standard?

No, jQuery is not a W3C standard.

What is the starting point of code execution in jQuery?

$(document).ready() function is the starting point of jQuery code. It is executed when DOM is loaded.

What is the basic requirement to start with the jQuery?

You need refer to its library to start with jQuery. You can download the latest version of jQuery from jQuery.com.

Can you use any other name in place of $ (dollar sign) in jQuery?

Yes, instead of $ (dollar sign) we can use jQuery as a function name. For example:

        
            jQuery(document).ready(function() {  
            jQuery("p").css("background-color", "pink");    
            });  
        
    
Can you use multiple document.ready() function on the same page?

Yes. You can use any number of document.ready() function on the same page. For example:

        
            $(document).ready(function() {    
                $("h3").css("background-color", "red");
             }); 
            $(document).ready(function() {    
                $("p").css("background-color", "pink");
            }); 
        
    
What is the difference between find and children methods?

Find method is used to find all levels down the DOM tree while children method is used to find single level down the DOM tree.

What is a CDN?

CDN stands for Content Delivery Network or Content Distribution Network. It is a large distributed system of servers deployed in multiple data centers across the internet. It provides the files from servers at a higher bandwidth that leads to faster loading time. These are several companies that provide free public CDNs:

  • Google
  • Microsift
  • Yahoo
What is the goal of CDN and what are the advantages of using CDN?

The primary goal of the CDN is to provide content to the end-users with high availability and high performance
Advantages of using CDN:

  • It reduces the load from the server.
  • It saves bandwidth. jQuery framework is loaded faster from these CDN.
  • If a user regularly visits a site which is using jQuery framework from any of these CDN, it will be cached.
How can you use a jQuery library in your project?

You can use a jQuery library in the ASP.Net project from downloading the latest jQuery library from jQuery.com and include the references to the jQuery library file in your HTML/PHP/JSP/Aspx page.