Top 50 J Query Interview Questions
Q1. Create A Plugin That Would Add And Remove A Class On Hover?
The plugin may be considered to be simply a brand new method that can be utilized by a person to increase the prototype item of a jquery. A plugin plays some moves on a set of factors. Each method that includes the jquery core can be taken into consideration to be a plugin.
The code for developing a plugin that might upload and do away with a category on hover might be as follows:
(characteristic($) $.Fn.HoverClass = characteristic(c) go back this.Hover( characteristic() $(this).ToggleClass(c); ); ; )(jQuery); // the usage of the plugin $('li').HoverClass('hover');
Q2. What Is Jquery.Holdready() Function?
By the usage of jQuery.HoldReady() function we are able to hold or launch the execution of jQuery’s ready occasion.
This technique have to be call earlier than we run ready occasion.
To delay the equipped event, we've got to name jQuery.HoldReady(true);
When we want to release the equipped event then we've to call jQuery.HoldReady(false);
This function is beneficial whilst we need to load any jQuery plugins earlier than the execution of equipped occasion.
For example
$.HoldReady(authentic);
$.GetScript("xyzplugin.Js", characteristic()
$.HoldReady(fake);
);
Q3. How Is The Deferred Method In Jquery Important In Relation To Animate Method?
The .Animate() method is used to create animations with other shorthands the usage of it. The queue() technique can be used to link collectively a couple of animation methods to create an unique impact. These strategies are powerful while all the data is to be had regionally and all the methods are finished on as single system best. In case the user desires to use the animation strategies on a records that resides on the server and desires to deal with at a unmarried pass the consumer can make used of the .Deferred technique.
For example:
var my$ = $.Sub(); my$.Fn.Animate=characteristic(props,pace,easing,callback)
var options=pace && typeof speed==="object"?
JQuery.Make bigger(, pace) :
whole: callback velocity ) && speed,
period: speed,
easing: callback && easing ;
var dfd = my$.Deferred(),
whole = options.Whole,
depend = this.Duration;
alternatives.Entire = feature()
entire && complete.Name( this );
if ( !--depend )
dfd.Clear up();
;
Q4. What Is Jquery $.Ajax() Method?
The Jquery ajax() approach is used to perform an AJAX (asynchronous HTTP) request.
Q5. How Check Currently Loaded Jquery Ui Version On The Page?
// Returns jQuery UI model or undefined $.Ui.Model
Q6. Difference Between Onload() And Document.Ready() Function Used In Jquery?
We can add multiple document.Geared up() characteristic in a web page.
We will have handiest one onload function.
Document.Equipped() characteristic is referred to as as soon as DOM is loaded.
Frame.Onload() characteristic is known as whilst the entirety (DOM, pix)receives loaded on the web page.
Q7. How Can We Give Fade Effect In J Query?
In jQuery we've got three techniques to present the fade effect to factors: fadeIn, fadeOut and fadeTo
This methods change the opacity of element with animation.
Syntax:
$(selector).FadeIn(velocity,callback) $(selector).FadeOut(velocity,callback) $(selector).FadeTo(pace,opacity,callback)
“pace” can be considered one of following values : “sluggish”, “fast”, “everyday” or milliseconds
“opacity” specify the price that allows the fading to given opacity.
“callback” is the feature which we need to run once the fading effect is whole.
For instance
$("clickme").Click on(characteristic()
$("mydiv").FadeTo("slow",0.50); );
$("clickme").Click(feature()
$("mydiv").FadeOut(3000); );.
Q8. What Is Difference Between Attribute Value And Property Value In Html?
Attribute values are values written in HTML text record But belongings value are values located in HTML DOM tree. Thus property values can exchange as per consumer interplay but Attribute values in no way modifications.
Q9. What Is The Use Of Jquery.Information()?
JQuery.Records() is used to set/return arbitrary records to/from an element.
Syntax: jQuery.Statistics(element, key, cost)
“detail” is the DOM element to which the information is related.
“key” is an arbitrary name of the piece of facts.
“price” is cost of the desired key.
Suppose we need to set the statistics for a span element:
jQuery.Records(span, “item”, val1: 10, val2: "myitem" );
If we want to retrieve the statistics related to div element and set it to label’s statistics:
$("label:val1").Text(jQuery.Statistics(div, "object").Val1);
$("label:val2").Text(jQuery.Facts(div, "object").Val2);
Q10. Can You Call C# Codebehind Method Using Jquery?
Yes
Q11. How It Affects The Performance ?
JQuery-1.4.4.Js document size is 178 KB as in opposition to its minified version jQuery-1.4.4-min.Js that is best seventy six.7 KB in length. So while your web page loads within the client's browser if you aren't the usage of minified version, it masses 178 KB record that takes greater time to load than 76.7 KB.
Q12. Is Jquery Replacement Of Java Script?
No. JQuery is not a replacement of JavaScript. JQuery is a exceptional library that is written on top of JavaScript. JQuery is a lightweight JavaScript library that emphasizes interplay between JavaScript and HTML.
Q13. Is There Any Difference Between Body Onload() Function Document.Equipped() Function Used In Jquery?
Record.Ready() function is different from body onload() function due to 2 motives.
We may have multiple document.Ready() feature in a page where we are able to have simplest one frame onload function.
Record.Equipped() characteristic is referred to as as quickly as DOM is loaded wherein body.Onload() feature is known as when the whole thing gets loaded on the page that consists of DOM, photographs and all related sources of the page.
Q14. What Js And Css File We Need To Reference While Developing Jquery Mobile Application?
Below are the generalised version of js and css file we want to reference even as developing Jquery Mobile utility. Jquery.Cellular-x.X.X.Min.Css jquery-x.X.X.Min.Js jquery.Cellular-x.X.X.Min.Js
Q15. Write A Code For The Implementation Of A Module Pattern?
The item literal does now not offer any privacy for the strategies or houses. The module sample permits the person to offer privateness to features and variables. It can be used to set to reveal constrained API.
For instance: The module sample code:
var characteristic =(characteristic() var privateThing = 'secret', publicThing = 'no longer secret', changePrivateThing = function() privateThing = 'super mystery'; , sayPrivateThing = characteristic() console.Log(privateThing); changePrivateThing(); ; go back publicThing : publicThing, sayPrivateThing : sayPrivateThing )(); characteristic.PublicThing; // 'no longer secret' function.SayPrivateThing();
Q16. What Is The Name Of Jquery Method For An Asynchronous Http Request ?
JQuery.Ajax()
Q17. Is Jquery A W3c Standard ?
No.
Q18. What Is Difference Between Document.Equipped() And Onload() ?
Document.Ready() feature can be inlcuded a couple of times whereas onload() technique can be called simplest once in a page.
Record.Equipped() is called as soon as DOM is loaded even as onload is referred to as whilst the whole thing is loaded on page i.E. Photographs, DOM and different sources related to the web page.
Q19. What Are Keyboard Events?
Keypress
keydown
keyup
Q20. What Is The Basic Need To Start With Jquery?
To start with jQuery, one need to make reference of it is library. The brand new model of jQuery can be downloaded from jQuery.Com.
Q21. What Is The Difference Between Jquery-x.X.X.Js And Jquery.X.X.X-min.Js?
In phrases of capability, there is no difference between the jQuery-x.X.X.Js and jQuery-x.X.X-min.Js (additionally known as minified version). However this may play a vital position within the performance of the web page.
Q22. Explain Hover() Method In Jquery?
The hover() method takes two functions and is a combination of the mouseenter() and mouseleave() techniques. The first characteristic is carried out whilst the mouse enters the HTML detail, and the second feature is executed whilst the mouse leaves the HTML detail:
Example:
$("#p1").Hover(function() alert("You entered p1!"); , characteristic() alert("Bye! You now go away p1!"); );
Q23. What Is Resize() Function In Jquery?
The resize() characteristic is known as every time the browser length is modified. This occasion may be most effective used with $(window).
Syntax: .Resize([event_data], handler(event_object))
The “event_data” is the data to be despatched to the handler.
The “handler(event_object)” is a feature to be called each time while the window is resized.
For instance
$(window).Resize(characteristic()
$('#message).Textual content('window is resized to'+$(window).Width()+
‘x’ + $(window).Top());
);
Q24. What Are The Advantages Of Using Jquery Over Javascript In Asp.Internet Web Application
Below are the blessings of the use of j Qery over JavaScript
Jquery is well written optimised javascript code so it will likely be faster in execution until we write identical general optimised javascript code.
Jquery is concise java script code ,me minimum ammount of code is to be written for the equal capability than the javascript.
Javascript associated Development is rapid using Jquery because most of the functionality is already written in the library and we just want to apply that.
Jquery has move browser support ,so we shop time for helping all of the browsers.
Q25. What Is The Difference Between .Js And .Min.Js ?
Min.Js is essentially the minified model of .Js file. Both the documents are equal as a long way as capability is involved.
.Min.Js is used to increase the web page overall performance as it's miles small in size compare to .Js and takes less time to load.
Q26. Explain The Animate Function?
The animate function is used to apply the custom animation impact to factors.
Syntax:
$(selector).Animate(params, [duration], [easing], [callback])
“param” defines the CSS houses on that you want to apply the animation.
“length” specify how lengthy the animation will run. It may be one in every of following values : “sluggish”, “fast”, “ordinary” or milliseconds
“easing” is the string which specify the function for the trition.
“callback” is the characteristic which we need to run once the animation effect is whole.
For instance
<div id id="clickToAnimate"> Click Me </div> <div id ="mydiv" style=”width:200px; height:300px; position: relative; right: 20px;"> </div>
Following is the jQuery to animate opacity, left offset, and height of the mydiv element
$('# clickToAnimate’).Click on(characteristic() $('#ebook').Animate( opacity: zero.30, left: '+=20', peak: 'toggle' , 3000, feature() // run after the animation whole. ); );
Q27. How Can You Select All Elements In Page Using Jquery ?
We can use all selector to pick all elements on web page.
Example : $('*')
Q28. Can We Use Our Own Specific Character In The Place Of $ Sign In J Query?
You can create your very own shortcut very effortlessly. The noConflict() approach returns a connection with jQuery, that you can store in a variable, for later use.
Q29. How To Use Jquery In Asp.Net Web Application?
To use jQuery in ASP.NET web software follow the beneath steps:
Go to http://jquery.Com/(The authentic jQuery WebSite)
Download cutting-edge .Js jQuery document from the website.
Put it the script(or different folder) within the root of your internet application
Add the below tag on the page where you want to apply Jquery
Q30. What Is Difference Between $(this) And 'this' In Jquery?
Refer the following instance
$(document).Ready(feature() $(‘#clickme’).Click(feature() alert($(this).Text()); alert(this.InnerText); ); );
this and $(this) references the equal detail however the difference is that “this” is utilized in conventional manner however when “this” is used with $() then it becomes a jQuery item on which we can use the capabilities of jQuery.
In the example given, when most effective “this” key-word is used then we will use the jQuery textual content() characteristic to get the textual content of the detail, because it isn't always jQuery item. Once the “this” keyword is wrapped in $() then we are able to use the jQuery function text() to get the textual content of the detail.
Q31. What Is The Use Of Jquery Min Js File In Asp.Internet Web Application?
JQuery min .Js file is actully a minified model of Actual JQuery .Js. The min documents have much less size however identical content material so this improves the overall performance.So You must favor to use min files.
Q32. What Does Size Method Of Jquery Returns ?
It returns the number of factors in the object. This technique helps in locating the matter of factors in the object.
Q33. What Is The Name Of Jquery Method Used For An Asynchronous Http Request?
JQuery.Ajax()
Q34. Name Some Of The Methods Of Jquery Used To Provide Effects?
Some of the not unusual techniques are :
Show()
Hide()
Toggle()
FadeIn()
FadeOut()
Q35. When And Who Founded Jquery ?
JQuery become based via John Resig in January 2006.
Q36. What Is Difference Between Remove And Detach Method ?
Detach approach is equal as dispose of technique , however detach continues the jQuery statistics associated with the removed factors.
Detach approach is greater powerful when you have to reinsert the removed records.
Q37. What Are The Slow Selectors In Jquery ?
Magnificence selectors are the slow evaluate to ID and detail.
Q38. How Does Jquery Store Data Related To An Element?
In undeniable java scripts the facts about an element can be saved by using including a domain item version belongings to the element. This consequences in memory leak issues in certain browsers. In jquery the person does now not has to worry about memory control issues.
For instance: storing and retrieving facts related to an detail:
$('#myDiv').Statistics('keyName', foo : 'bar' ); $('#myDiv').Facts('keyName'); // foo : 'bar'
Jquery lets in the person to keep any type of information on an detail. The $.Fn.Facts is used the maximum to shop records associated with an element.
For ex. Storing of courting among elements with using $.Fn.Records :
$('#myList li').Each(function() var $li = $(this), $div = $li.Find('div.Content'); $li.Records('contentDiv', $div); ); // later, the consumer isn't always required to look for the div once more; // the records can clearly be examine from the listing objects data; var $firstLi = $('#myList li:first'); $firstLi.Information('contentDiv').Html('new content');
Q39. What $("div.Tutoriz") Will Select?
All the div detail with tutoriz magnificence.
Q40. Explain Mousedown() Method In Jquery?
The mousedown() technique attaches an event handler feature to an HTML element. The characteristic is done, while the left mouse button is pressed down, at the same time as the mouse is over the HTML element:
Example: $("#p1").Mousedown(feature() alert("Mouse down over p1!"); );
Q41. What Are Events In Jquery?
All the traffic actions that an internet page can reply to are referred to as events. An event represents the perfect second while something takes place.
Examples: .Transferring a mouse over an detail .Selecting a radio button The term "fires" is often used with activities.
Example: "The click on occasion fires the instant in case you click the mouse".
Q42. What Are Jquery Selectors ?
Selectors are utilized in jQuery to locate and select DOM factors thru identification, magnificence or detail selector. There are many new selectors added in jQuery. Using jQuery selectors DOM elements may be decided on and manipulated.
Q43. Write The Code To Define A Requirejs Module With Its Dependencies?
The RequireJS is a dependency management tool that can be utilized by the consumer to manipulate script modules. It can be used to load scripts as soon as a web page has been loaded. This enables in calmly distributing the downloads.
For instance: RequireJS module with dependencies described:
require.Def("my/shirt",
["my/cart", "my/inventory"],
function(cart, stock)
//go back an object to define the "my/blouse" module.
Go back
colour: "blue",
length: "big"
addToCart: function()
stock.Decrement(this);
cart.Upload(this);
);
In the above example the my.Blouse module is created. This module relies upon at the my/cart and my/inventory.
Q44. Which One Is Faster Jquery Id Selector Or Javascript Getelementbyid()?(jquery Id Selector Vs Javascript Getelementbyid())
JavaScript getElementById() is quicker than Jquery Id ($("#elementID")) selector
Q45. Write The Code For Select Second Last Div Element?
Code for 2d closing div : $("div.Questions > div::nth-final-infant(2)").Css("shade", "purple");
Q46. How Can Images Be Made To Appear Scrolling One Over Another?
Jquery provides the consumer with the potential to exchange the attributes of a property dynamically. The jquery slide method can be used to change the peak of elements regularly. This can be used to present the scroll effect of an photo over photograph.
The jquery comprises of the subsequent slide strategies:
$(selector).SlideDown(speed,callback)
$(selector).SlideUp(speed,callback)
$(selector).SlideToggle(speed,callback)
The speed parameter is used to impact the rate of alternate of the jquery. The parameters for it may be gradual, fast , normal and time in milliseconds. The parameter of callback is used to consult the call of the feature to be completed as soon as the of entirety of function happens.
Q47. What Is Cdn And How Jquery Is Related To It ?
CDN - It stands for Content Distribution Network or Content Delivery Network. Generally, a collection of structures at various places related to trfer information files between them to boom its bandwidth whilst having access to facts. The regular architecture is designed in any such way that a consumer get right of entry to a file copy from its nearest consumer in preference to accessing it from a centralized server. So we will load this jQuery record from that CDN in order that the performance of all of the clients running below that community will be improved.
Q48. How Can We Apply Css In Div Using Jquery?
The use of css() technique we can apply css in div detail.
Instance:$(“div”).Css(“border”,”1px stable inexperienced”);
Q49. What Is The Use Of J Query Load() Method ?
The jQuery load() method is robust AJAX technique.
The load() technique hundreds statistics from a server and puts the lower back data into the chosen detail without reload the whole page.
Q50. Jquery Is Replacement Of Java Script?
NO
