jQuery Interview Questions and Answers (185) - Page 3

Latest and authentic Interview questions. You can also post an interview question and win monthly prizes as well as gain community credit points.

185 records found.

Post |

Interview Experiences |

Interview FAQs |

Online Interviews |

Exclusive Questions

Get 650+ Questpond's Interview videos on discount

What is the use of jQuery Connect?

It is used to connect or bind a function to another function.It is use to execute a function whenever
a function from another object is executed.

e.g.

function FirstFunction(){ 

this.Func1 = function(){ 

       execute1 = 'A class'; 

      } 

} 

var firstFunc = new FirstFunction();

 

function SecondFunction(){ 

 this.Func2 = function(){ 

 execute2 = 'Another Class'; 

 } 

} 

var secondFunc = new SecondFunction(); 

$.connect(firstFunc,'Func1',secondFunc,Func2);

In this case whevever we invoke secondFunc.Func2,firstFunc.Func1 will also gets executed indicating that
Func2 of object secondFunc has been associated/ connected to Func1 of object firstFunc

What is the use of jQuery disconnect?

It is used to disconnect a function to another function.It is the opposite of $.connect.

e.g.

$.disconnect(firstFunc,'Func1',secondFunc,Func2);

will disconnect Func1 from Func2 where Func1 is the reference function and Func2 is connected one.

What is the use of jQuery disconnectAll?

It is used to disconnect all the connected functions.

e.g.

$.disconnectAll(firstFunc,'Func1');

will disconnect all the connected function from the reference function Func1.

What are the minimal/must steps needed to execute JQuery?

1.Wait for the DOM of the page to be ready.
2.Finds the appropriate HTML elements that needs to be acted on by using selector.
3.Add event handlers.

e.g.

//Step 1: Wait for the DOM of the page to be ready. 

$(document).ready(function () 

{

	//Step 2: Finds the appropriate HTML elements that needs to be acted on by using selector

	var btnObject = $('#btnSayHello'); 

	

	//Step 3: Add event handlers (Here click events)

	btnObject.click(function () 

	{

		alert("Hello World...My First JQuery Program");

	});

});

How to debug JQuery?

1.Placing debugger keyword

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.

e.g.

<script language ="javascript">

$(document).ready(function () 

{

   var btnObject = $('#btnSayHello');

   debugger;

    btnObject.click(function ()

   {

       alert("Hello World...My First JQuery Program");

   });

});

</script>

2.Inserting a break point after attaching worker process

Press ALT + CTRL + P or tools -> AttachProcess then choose w3wp.exe .

What are the ways by which we can include JQuery in our page?

1.Refer to a local copy using the <script> tag
2.Refer to a remote copy on JQuery.com or the remote copy in the Google AJAX API
3.Refer to a local copy using Script Manager Control
4.Refer to an embedded script using the ClientScript object

How to invoke Jquery function from code behind?

Suppose we want to change the background color of a div tag from the code behind upon button click.In code behind write the below

protected void btnChangecolor_Click(object sender, EventArgs e) 

{ 

string script = "<script type=\"text/JavaScript\" language=\"javascript\">ChangeDivBackgroundcolor();</script>";

 Page.ClientScript.RegisterStartupScript(this.GetType(), "ChangeColor", script); 

 }

The aspx file will be as under

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head runat="server"> 

<title></title> 

<script type="text/javascript" src="Scripts/jquery-1.7.2.js"></script> 

<script type="text/javascript"> 

function ChangeDivBackgroundcolor() 

{ 

var divObject = $('#divTest'); 

divObject.css("background-color", "cyan"); 

} 

</script> 

</head> 

<body> 

<form id="form1" runat="server"> 

<div> 



<asp:Button ID="btnChangecolor" runat="server" Text="Say Hello" onclick="btnChangecolor_Click" />

 </div> 

<div id="divTest">Change the color of this div</div> 

</form> 

</body> 

</html>

What is the significance of document.ready()?

It indicates that the DOM of the page is ready and we can start manipulating the DOM elements even though other parts
of the page content(e.g. images/other external resources) are not fully loaded.As soon as the DOM is loaded,
everything inside the (document).ready() should be load even before the page contents are loaded.

Why is JQuery faster than Javascript at execution time?

The onLoad function for the window object executes after the entire page is fully loaded.Untill DOM tree is completely created and all images/other associated resources (like audio files,video files etc) are fully loaded,this onLoad function is never executed and hence the script execution needs to wait till the page is loaded.

But the document.ready() method of JQuery indicates that the DOM of the page is ready and we can start manipulating the DOM elements even though other parts of the page content(e.g. images/other external resources) are not fully loaded.As soon as the DOM is loaded, everything inside the (document).ready() should be load even before the page contents are loaded.

It is because of this reason that JQuery code runs faster

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 .jQuery-x.x.x-min.js is also called as minified version of jQuery.

jQuery-1.4.4.js file size is 178 KB and the jQuery-1.4.4-min.js size is 76.7 KB. If you are not using minified version of jQuery,then it will load the 178 kb file( jQuery-1.4.4.js).So it will take the much time to load the page and will hurt the performance.

So we can prefer using jQuery-1.4.4.js during development and jQuery-1.4.4-min.js when we move the code into production environment.

What is the purpose of jquery-x.x.x-vsdoc.js?

Generally we will use jQuery-x.x.x-vsdoc.js to provide the intellisense support. We can even delete this file. But the thing is that it won't provide the intellisense support if we delete that file.

Which one is the right way to get the TextBox value with id="txtbox" in Jquery?

NOTE: This is objective type question, Please click question title for correct answer.

Differentiate between jquery's ready and holdReady?

jQuery's ready is an event which gets triggered automatically when DOM is ready while holdReady is a signal/flag to hold this triggering. holdReady was included in 1.6 version and it works only if used before the execution/triggering of ready event. Once ready event is fired, it has nothing to do. It is useful in dynamically loading scripts before the ready starts. It release ready event execution when used with a true parameter.