Explore topic-wise InterviewSolutions in .

CDN - It stands for Content Distribution Network or Content Delivery Network. Generally, a GROUP of systems at various places connected to TRANSFER data files between them to increase its bandwidth while accessing data. The typical ARCHITECTURE is designed in such a way that a client access a file copy from its nearest client rather than accessing it from a centralized server. So we can load this jQuery file from that CDN so that the efficiency of all the clients working under that network will be increased.

CDN - It stands for Content Distribution Network or Content Delivery Network. Generally, a group of systems at various places connected to transfer data files between them to increase its bandwidth while accessing data. The typical architecture is designed in such a way that a client access a file copy from its nearest client rather than accessing it from a centralized server. So we can load this jQuery file from that CDN so that the efficiency of all the clients working under that network will be increased.

The advantage of using a MINIFIED version of JQuery file is Efficiency of the web page increases. The NORMAL version jQuery-x.x.x.js has a file SIZE of 178KB but the minified version jQuery.x.x.x-min.js has 76.7 KB. The reduction in size makes the page to load more faster than you use a conventional jQuery file with 178KB

The advantage of using a minified version of JQuery file is Efficiency of the web page increases. The normal version jQuery-x.x.x.js has a file size of 178KB but the minified version jQuery.x.x.x-min.js has 76.7 KB. The reduction in size makes the page to load more faster than you use a conventional jQuery file with 178KB

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"&GT;< /script>

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>

Yes, it is always GOOD to load your JQUERY from content delivery network. It provides some benefits like :- Caching - It means that if any previously visited site by USER is using jQuery from Google CDN then the cached version will be USED. It will not be DOWNLOADED again. Reduces load - It reduces the load on your web server as it downloads from Google server's.

Yes, it is always good to load your jquery from content delivery network. It provides some benefits like :- Caching - It means that if any previously visited site by user is using jQuery from Google CDN then the cached version will be used. It will not be downloaded again. Reduces load - It reduces the load on your web server as it downloads from Google server's.

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: Faster page load as jQuery file need not to be downloaded Saves your bandwidth as jQuery file is not LOADED from your server 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.

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: Faster page load as jQuery file need not to be downloaded Saves your bandwidth as jQuery file is not loaded from your server 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.

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.

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.

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.

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.

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.

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.

using css() method we can apply css in DIV ELEMENT.

example:$(“div”).css(“border”,”1px SOLID GREEN”);

using css() method we can apply css in div element.

example:$(“div”).css(“border”,”1px solid green”);

* You can use the is() method along with an APPROPRIATE selector

if ( $(‘#myDiv’).is(‘.PRETTY’) ) $(‘#myDiv’).show();

NOTE that this method ALLOWS you to test for other things as well.

For example, you can test whether an element is hidden (by using the custom :hidden selector):

if ( $(‘#myDiv’).is(‘:hidden’) ) $(‘#myDiv’).show();

* You can use the is() method along with an appropriate selector

if ( $(‘#myDiv’).is(‘.pretty’) ) $(‘#myDiv’).show();

Note that this method allows you to test for other things as well.

For example, you can test whether an element is hidden (by using the custom :hidden selector):

if ( $(‘#myDiv’).is(‘:hidden’) ) $(‘#myDiv’).show();

you can disable/enable web element USING ATTR and removeAttr functions RESPECTIVELY.

you can disable/enable web element using attr and removeAttr functions respectively.

Using TWO function, we can PERFORM the OPERATION.

// Check #X $(“#checkboxid”).attr(“checked”, “checked”);
// Uncheck #x $(“#checkboxid”).removeAttr(“checked”);

Using two function, we can perform the operation.

// Check #x $(“#checkboxid”).attr(“checked”, “checked”);
// Uncheck #x $(“#checkboxid”).removeAttr(“checked”);

Below are the GENERALISED VERSION of js and CSS FILE we need to reference while developing JQUERY Mobile application. jquery.mobile-x.x.x.min.css jquery-x.x.x.min.js jquery.mobile-x.x.x.min.js

Below are the generalised version of js and css file we need to reference while developing Jquery Mobile application. jquery.mobile-x.x.x.min.css jquery-x.x.x.min.js jquery.mobile-x.x.x.min.js

data-role attribute of div in Jquery Mobile generally assigned the following values to start with(However other values are there too):

This attribute is used for CREATING styled WIDGET.

data-role attribute of div in Jquery Mobile generally assigned the following values to start with(However other values are there too):

This attribute is used for creating styled widget.

Below is the CODE to create a button with JQUERY Mobile

&LT;a HREF="#" data-role="button" data-icon="">Press</a>

Below is the code to create a button with Jquery Mobile

<a href="#" data-role="button" data-icon="">Press</a>

data-role = "listview" in Jquery MOBILE is USED to create a BULLETED list of item as shown below:

data-role = "listview" in Jquery Mobile is used to create a bulleted list of item as shown below:

Attribute values are values written in HTML TEXT file But property VALUE are values found in HTML DOM tree. THUS property values can CHANGE as per user interaction but Attribute values never CHANGES.

Attribute values are values written in HTML text file But property value are values found in HTML DOM tree. Thus property values can change as per user interaction but Attribute values never changes.

if(navigator.platform.indexOf("iPad") != -1) { //MEANS it is iPad RETURN true; }

else { //means it is not iPad return false; }

if(navigator.platform.indexOf("iPad") != -1) { //means it is iPad return true; }

else { //means it is not iPad return false; }

event.preventDefault FUNCTION in JQUERY is used to prevent the DEFAULT behaviour of the event in QUESTION.

For eaxmple if you want to prevent the default behaviour of click event then use the following code

$("div").click(function(event){ event.preventDefault();
$(this).hide("SLOW"); });

Now if you will click on the div it will disappear slowly.

event.preventDefault function in Jquery is used to prevent the default behaviour of the event in question.

For eaxmple if you want to prevent the default behaviour of click event then use the following code

$("div").click(function(event){ event.preventDefault();
$(this).hide("slow"); });

Now if you will click on the div it will disappear slowly.

A CALLBACK function is nothing but a function to be PASSED as an argument to another function and it runs after its parent function has EXECUTED.

$.get(''sample.html'', sampleCallBackFunction);

NOTE that here sampleCallBackFunction does not have any ARGUMENTS.

A callback function is nothing but a function to be passed as an argument to another function and it runs after its parent function has executed.

$.get(''sample.html'', sampleCallBackFunction);

Note that here sampleCallBackFunction does not have any arguments.

Yes. A FUNCTION that APPEARS after parent function may or may not execute before the callback function depending UPON the RESPONSE from parent function.

Yes. A function that appears after parent function may or may not execute before the callback function depending upon the response from parent function.

The below code is correct for call back USING arguments

$.GET(''samplepage.html'', FUNCTION(){ sampleCallBackFunction(arg1, arg2); });

where get is parent function and sampleCallBackFunction is call back function Howevwer if you will do LIKE below it will not work:

$.get(''samplepage.html'', sampleCallBackFunction(arg1, arg2));

The below code is correct for call back using arguments

$.get(''samplepage.html'', function(){ sampleCallBackFunction(arg1, arg2); });

where get is parent function and sampleCallBackFunction is call back function Howevwer if you will do like below it will not work:

$.get(''samplepage.html'', sampleCallBackFunction(arg1, arg2));

1. To apply CSS static or dynamic
2. To CALL functions on EVENTS
3. Crisscross the documents
4. MANIPULATION purpose
5. To add ANIMATION effects In all the cases we are using JAVASCRIPT can be replaced with jQuery in the projects. This can reduce maintenance.

This is a jQuery plugin that is used to connect / bind a function to another function. It is more of assigning a handler for another function. Connect is used to execute a function WHENEVER a function from another object or plugin is executed. We can connect to an event of a DOM element too USING this function. In the sense same connect function can be used for both DOM elements and for the functions. $.connect (refobj, refFuncName, connObj, connFunc); This means that, when the reference function is executed, the connected function gets executed automatically after it. To UNDERSTAND more please analyze the following example function A(){ this.fun1 = function(){ CALLED1 = 'calssA-fun1'; } } var a = new A(); function B(){ this.fun2 = function(){ called2 = 'classB-fun1'; } } var b = new B();

$.connect(a,'fun1',b,fun2); Here we connected "fun2" of object b to "fun1" of object a. When we call b.fun2, a.fun1 will also execute automatically. This is very handy to execute some function when some other function is executed from the plug-in . In order to play with it follow these steps. ->Download jquery.connect.js file. ->Include this file in your HTML file. ->Take help of $.connect function as illustrated to connect a function to another function.

This is a jQuery plugin that is used to connect / bind a function to another function. It is more of assigning a handler for another function. Connect is used to execute a function whenever a function from another object or plugin is executed. We can connect to an event of a DOM element too using this function. In the sense same connect function can be used for both DOM elements and for the functions. $.connect (refobj, refFuncName, connObj, connFunc); This means that, when the reference function is executed, the connected function gets executed automatically after it. To understand more please analyze the following example function A(){ this.fun1 = function(){ called1 = 'calssA-fun1'; } } var a = new A(); function B(){ this.fun2 = function(){ called2 = 'classB-fun1'; } } var b = new B();

$.connect(a,'fun1',b,fun2); Here we connected "fun2" of object b to "fun1" of object a. When we call b.fun2, a.fun1 will also execute automatically. This is very handy to execute some function when some other function is executed from the plug-in . In order to play with it follow these steps. ->Download jquery.connect.js file. ->Include this file in your html file. ->Take help of $.connect function as illustrated to connect a function to another function.

jQuery is like the ASP.NET AJAX Client Framework (MicrosoftAjax.js), with selectors, DOM selections/ manipulations, plug-ins, and BETTER animation support. jQuery is more powerful than MS AJAX on the client side due to its light weight nature . This is the REASON Microsoft INTEGRATED jQuery with Visual Studio. JQuery is integrated for post VS versions 2008, no explicit download of jQuery file is REQUIRED for the versions above VS2010. Ajax is a Technology for Asynchronous Data Transferring. AJAX is a technique to do an XMLHttpRequest from a web page to the SERVER and send or receive data to be used on the web page.

jQuery is like the ASP.NET AJAX Client Framework (MicrosoftAjax.js), with selectors, DOM selections/ manipulations, plug-ins, and better animation support. jQuery is more powerful than MS AJAX on the client side due to its light weight nature . This is the reason Microsoft integrated jQuery with Visual Studio. JQuery is integrated for post VS versions 2008, no explicit download of jQuery file is required for the versions above VS2010. Ajax is a Technology for Asynchronous Data Transferring. AJAX is a technique to do an XMLHttpRequest from a web page to the server and send or receive data to be used on the web page.

The blur() METHOD attaches an event handler function to an HTML form FIELD. The function is executed when the form field loses focus:

EXAMPLE: $("INPUT").blur(function(){ $(this).CSS("background-color","#ffffff"); });

The blur() method attaches an event handler function to an HTML form field. The function is executed when the form field loses focus:

Example: $("input").blur(function(){ $(this).css("background-color","#ffffff"); });

The focus() method attaches an event handler FUNCTION to an HTML form FIELD. The function is executed when the form field gets focus:

Example: $("input").focus(function(){ $(this).CSS("background-color","#cccccc"); });

The focus() method attaches an event handler function to an HTML form field. The function is executed when the form field gets focus:

Example: $("input").focus(function(){ $(this).css("background-color","#cccccc"); });

The HOVER() method takes two FUNCTIONS and is a combination of the mouseenter() and mouseleave() methods. The first function is executed when the mouse enters the HTML element, and the second function is executed when the mouse leaves the HTML element:

Example:

$("#p1").hover(function(){ alert("You entered p1!"); }, function(){ alert("Bye! You now LEAVE p1!"); });

The hover() method takes two functions and is a combination of the mouseenter() and mouseleave() methods. The first function is executed when the mouse enters the HTML element, and the second function is executed when the mouse leaves the HTML element:

Example:

$("#p1").hover(function(){ alert("You entered p1!"); }, function(){ alert("Bye! You now leave p1!"); });

The mouseup() method ATTACHES an event handler function to an HTML ELEMENT. The function is executed, when the LEFT mouse button is released, while the mouse is over the HTML element:

EXAMPLE: $("#p1").mouseup(function(){ alert("Mouse up over p1!"); });

The mouseup() method attaches an event handler function to an HTML element. The function is executed, when the left mouse button is released, while the mouse is over the HTML element:

Example: $("#p1").mouseup(function(){ alert("Mouse up over p1!"); });

The mousedown() method ATTACHES an event handler function to an HTML element. The function is executed, when the left MOUSE button is PRESSED down, while the mouse is over the HTML element:

EXAMPLE: $("#p1").mousedown(function(){ alert("Mouse down over p1!"); });

The mousedown() method attaches an event handler function to an HTML element. The function is executed, when the left mouse button is pressed down, while the mouse is over the HTML element:

Example: $("#p1").mousedown(function(){ alert("Mouse down over p1!"); });

The mouseenter() METHOD ATTACHES an event handler function to an HTML element. The function is executed when the MOUSE pointer ENTERS the HTML element:

Example: $("#p1").mouseenter(function(){ alert("You entered p1!"); });

The mouseenter() method attaches an event handler function to an HTML element. The function is executed when the mouse pointer enters the HTML element:

Example: $("#p1").mouseenter(function(){ alert("You entered p1!"); });

The DBCLICK() METHOD ATTACHES an event handler function to an HTML ELEMENT. The function is executed when the USER double-clicks on the HTML element:

The dbclick() method attaches an event handler function to an HTML element. The function is executed when the user double-clicks on the HTML element:

<P>The click() method ATTACHES an event handler function to an HTML element. The function is executed when the user CLICKS on the HTML element. The following example SAYS: When a click event fires on a element; hide the current element:

Example: $("p").click(function(){ $(this).hide(); });

The click() method attaches an event handler function to an HTML element. The function is executed when the user clicks on the HTML element. The following example says: When a click event fires on a element; hide the current element:

Example: $("p").click(function(){ $(this).hide(); });

Most DOM events have an EQUIVALENT jQuery method.

Example:

STEP 1: To assign a click event to all paragraphs on a page, you can do this: $("p").click();

Step 2: The next step is to define what should happen when the event fires. You must PASS a function to the event:

$("p").click(function(){ // action goes here!! });

Most DOM events have an equivalent jQuery method.

Example:

Step 1: To assign a click event to all paragraphs on a page, you can do this: $("p").click();

Step 2: The next step is to define what should happen when the event fires. You must pass a function to the event:

$("p").click(function(){ // action goes here!! });

1. LOAD
2. RESIZE
3. SCROLL
4. UNLOAD

1. SUBMIT
2. CHANGE
3. FOCUS
4. BLUR

1. CLICK
2. dblclick
3. mouseenter
4. mouseleave

All the VISITORS actions that a WEB page can respond to are called events. An event represents the precise moment when SOMETHING happens.

Examples: .moving a mouse over an element .selecting a radio BUTTON The term "FIRES" is often used with events.

Example: "The click event fires the moment if you click the mouse".

All the visitors actions that a web page can respond to are called events. An event represents the precise moment when something happens.

Examples: .moving a mouse over an element .selecting a radio button The term "fires" is often used with events.

Example: "The click event fires the moment if you click the mouse".

Some of the COMMON METHODS are :

1. SHOW()
2. HIDE()
3. TOGGLE()
4. FadeIn()
5. FadeOut()

Some of the common methods are :

There are 3 types of SELECTORS in Jquery

1. CSS Selector
2. XPATH Selector
3. CUSTOM Selector

There are 3 types of selectors in Jquery

YES. We can have any NUMBER of document.ready() FUNCTION on the same PAGE.

YES. We can have any number of document.ready() function on the same page.

document.ready() function is different from body onload() function due to 2 REASONS.

1. We can have more than ONE document.ready() function in a page where we can have only one body 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.

document.ready() function is different from body onload() function due to 2 reasons.

DOLLAR Sign is nothing but it's an alias for JQUERY. Take a LOOK at below jQuery code.

$(document).READY(function(){ });

Over here $ sign can be replaced with "jQuery" keyword. VIEW sourceprint?

jQuery(document).ready(function(){ });

Dollar Sign is nothing but it's an alias for JQuery. Take a look at below jQuery code.

$(document).ready(function(){ });

Over here $ sign can be replaced with "jQuery" keyword. view sourceprint?

jQuery(document).ready(function(){ });

To START with JQUERY, one need to make reference of it's library. The LATEST version of jQuery can be downloaded from jQuery.com.

To start with jQuery, one need to make reference of it's library. The latest version of jQuery can be downloaded from jQuery.com.

No. JQUERY is not a REPLACEMENT of JAVASCRIPT. jQuery is a different library which is written on top of JavaScript. jQuery is a lightweight JavaScript library that EMPHASIZES interaction between JavaScript and HTML.

No. jQuery is not a replacement of JavaScript. jQuery is a different library which is written on top of JavaScript. jQuery is a lightweight JavaScript library that emphasizes interaction between JavaScript and HTML.

ALWAYS load your jQuery framework from Google, Microsoft or jQuery CDN(Content Delivery Network). As it provides several advantages.

1. You always use the latest jQuery framework.
2. It REDUCES the load from your server.
3. It saves bandwidth. jQuery framework will load faster from these CDN.
4. The most important BENEFIT is it will be CACHED, if the user has visited any SITE which is using jQuery framework from any of these CDN.

Always load your jQuery framework from Google, Microsoft or jQuery CDN(Content Delivery Network). As it provides several advantages.

jQuery.ajax()

jQuery.ajax()

We can add more than one document.ready() function in a page.

we can have only one onload function.

Document.ready() function is CALLED as soon as DOM is LOADED.

body.onload() function is called when everything (DOM, images)gets loaded on the page.

We can add more than one document.ready() function in a page.

we can have only one onload function.

Document.ready() function is called as soon as DOM is loaded.

body.onload() function is called when everything (DOM, images)gets loaded on the page.

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>

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>

Add the keyword "DEBUGGER;" to the line from where we WANT to start the debugging and then RUN the Visual Studio in Debug mode by PRESSING F5 or using the Debug button.

Add the keyword "debugger;" to the line from where we want to start the debugging and then run the Visual Studio in Debug mode by pressing F5 or using the Debug button.