jQuery useful Questions and Answers

Q: - Why to load jQuery file from CDN?

You may ask that if we can load the jQuery file from our own server why to load it from the CDNs. The answer is logical and very simple. The browser behavior is that whenever it loads any webpage, it keeps related files (eg. Javascript file, CSS file and Images) used for that page into its cache (also called history). When next time the user browses any web page, browser loads only those files that are new or modified and is not available in the browser cache or history. In this way, browser improves its performance and loads the page.
The possibility is that if more and more websites are using CDNs, the user might have already browsed some other web pages that is using CDNs jQuery file and that file may have into browser cache; so when user browse your page and you are also using CDNs file, the older cached version of jQuery file will be used. In this way your page will load faster as browser will not have to load the jQuery file for your page again.
The benefit
1. Faster page load as jQuery file need not to be downloaded
2. Saves your bandwidth as jQuery file is not loaded from your server
3. Scalable - generally CDNs place these files on the servers located at different geographical locations of the world so that they load faster so irrespective of from where your user is browsing your page, your application runs well.
Q: - What if the latest jQuery version is available and I am still referring older version of jQuery file from CDNs?

Do not worry about it, it?s a general promise made by CDNs that they will remain hosting the older version of the files on the same location where they had initially released; so even if newer version of the files are released, the older version remains there on the CDNs and your web page still works.
Q: - Do we need to add the JQuery file both at the Master page and Content page as well?

No, if the Jquery file has been added to the master page then we can access the content page directly without adding any reference to it.
This can be done using this simple example
<script type="text/javascript" src="jQuery-1.4.1-min.js"></script>
 Q: - Do I need to refer jQuery file both in Master page/base page/template page and content page?

No, master page/base page/ template page basically helps to create consistent layout for the page in the application. In case you have referred the jQuery file in master page/base page/ template page that cause rendering the file in the browser, you do not need to refer jQuery file the content page again.

In summary, there should not be more than one <script> tag with jQuery file reference in the source code of the rendered web page in the browser.
Q: - What is the difference between jQuery-x.x.x.js and jQuery.x.x.x-min.js

In terms of functionality, there is no difference between the jQuery-x.x.x.js and jQuery-x.x.x-min.js (also called minified version). However this can play a vital role in the performance of the web page.

How it affects the performance?
jQuery-1.4.4.js file size is 178 KB as against its minified version jQuery-1.4.4-min.js that is only 76.7 KB in size. So when your page loads in the client?s browser if you are not using minified version, it loads 178 KB file that takes more time to load than 76.7 KB
Q: - Which version of jQuery file should be used?

In most of the recent releases so far, the core functionality of jQuery remains same however some more cool and better features are added. Ideally you should use the latest jQuery files available on the jQuery.com website. By doing this you ensure that your earlier functionality will still work and you can use new features available as part of the new release.
 Q: - What are the steps you need to follow to use jQuery in ASP.Net project?

It's really simple. One just need to add reference of javascript file(.js). Go to Jquery.com and download the latest version of jQuery. When download is completed, there is a "jQuery-1.3.2.js" in the folder. Include this file

<script src="_scripts/jQuery-1.3.2.js" type="text/javascript"></script>
and you good to go now for JQuery.
Note : 1.3.2 denotes the library version.. It can be vary depending upon the version of Jquery you download.
Q: - What is JQuery UI?

JQuery UI is a library which is built on top of JQuery library. JQuery UI comes with cool widgets, effects and interaction mechanism.
Q: - What are features of JQuery or what can be done using JQuery?

Features of Jquery
1. One can easily provide effects and can do animations.
2. Applying / Changing CSS.
3. Cool plugins.
4. Ajax support
5. DOM selection events
6. Event Handling
 Q: - Why jQuery?

jQuery is very compact and well written JavaScript code that increases the productivity of the developer by enabling them to achieve critical UI functionality by writing very less amount of code.

It helps to

# Improve the performance of the application
# Develop most browser compatible web page
# Implement UI related critical functionality without writing hundreds of lines of codes
# Fast
# Extensible – jQuery can be extended to implement customized behavior

Other advantages of jQuery are

# No need to learn fresh new syntax's to use jQuery, knowing simple JavaScript syntax is enough
# Simple and Cleaner code, no need to write several lines of codes to achieve complex functionality.



Q: - Why jQuery?

jQuery is very compact and well written JavaScript code that increases the productivity of the developer by enabling them to achieve critical UI functionality by writing very less amount of code.

It helps to

# Improve the performance of the application
# Develop most browser compatible web page
# Implement UI related critical functionality without writing hundreds of lines of codes
# Fast
# Extensible – jQuery can be extended to implement customized behavior

Other advantages of jQuery are

# No need to learn fresh new syntax's to use jQuery, knowing simple JavaScript syntax is enough
# Simple and Cleaner code, no need to write several lines of codes to achieve complex functionality.



Q: - How to use jQuery?

jQuery usually comes as a single JavaScript file containing everything comes out of the box with jQuery. It can be included within a web page using the following mark-up:

To load local jQuery file

<script type="text/javascript" src="jQuery-1.4.1-min.js"></script>

Ideally this markup is kept in under <head></head> tag of your web page, however you are free to keep anywhere you want.
Q: - How is body onload() function is different from document.ready() function used in jQuery?

Document.ready() function is different from body onload() function because off 2 reasons.

1. We can have more than one document.ready() function in a page where we can have only one onload function.
2. Document.ready() function is called as soon as DOM is loaded where body.onload() function is called when everything gets loaded on the page that includes DOM, images and all associated resources of the page.
JQuery Interview Questions & Answers

Q: - How do You disable or enable a form element?

There are two ways to disable or enable form elements.
Set the 'disabled' attribute to true or false:
 // Disable #pcds
$('#pcds').attr('disabled', true);
// Enable #pcds
$('#pcds').attr('disabled', false);

Add or remove the 'disabled' attribute:  // Disable #pcds
$("#pcds").attr('disabled', 'disabled');
// Enable #x
$("#pcds").removeAttr('disabled');
Q: - How do you check or uncheck a checkbox input or radio button?

There are two ways to check or uncheck a checkbox or radio button.
Set the 'checked' attribute to true or false.  // Check #pcds
$('#pcds').attr('checked', true);
// Uncheck #pcds
$('#pcds').attr('checked', false);

Add or remove the 'checked' attribute:
 // Check #pcds
$("#pcds").attr('checked', 'checked');
// Uncheck #pcds
$("#pcds").removeAttr('checked');
Q: - What are the advantages of JQuery ?

There are many advantages with JQuery. Some of them are :

. It is more like a JavaScript enhancement so there is no overhead in learning a new syntax.
. It has the ability to keep the code simple, readable, clear and reusable.
. It would eradicate the requirement for writing complex loops and DOM scripting library calls.
Q: - How do you select an item using css class or ID and get the value by use of jquery

If an element of html like < div> , < p> or any tag have ID MyId and class used MyClass then we select the element by below jquery code

$('#MyId') for ID and for classs $('.MyClass') and for value

var myValue = $('#MyId').val(); // get the value in var Myvalue by id
Or for set the value in selected item

$('#MyId').val("print me"); // set the value of a form input
Q: - >How to get the server response from an AJAX request using Jquery?

When invoking functions that have asynchronous behavior We must provide a callback function to capture the desired result. This is especially important with AJAX in the browser because when a remote request is made, it is indeterminate when the response will be received.
Below an example of making an AJAX call and alerting the response (or error):
 $.ajax({
     url: 'pcdsEmpRecords.php',
     success: function(response) {
        alert(response);
     },
     error: function(xhr) {
        alert('Error!  Status = ' + xhr.status);
     }
});
Q: - How do you update ajax response with id " resilts"

By using below code we can update div content where id 'results' with ajax response
 function updateStatus() {
     $.ajax({
            url: 'pcdsEmpRecords.php',
            success: function(response) {
             // update div id Results
             $('#results').html(response);
         }
     });
}