Q1. What is Jquery?
- A free , open-source Javascript library
- It simplifies many common web development tasks
- It smooths over cross-browser development issue
- It has concise, easy-to-read syntax that reduces verbose code
Q2. What is $ sign?
- $ Sign is short hand way calling Jquery library.
- If we don’t want to use $ , we can use word jQuery
Q3. What does $(document) means?
- It means we are ready to perform document operation .
- ready function setups event listener when dom structure of page fully passed by browser
- This is different from onload event which is normally used in javascript
- Because onload id is fired when all content is loaded in browser.
- .ready allow us work with dom much earlier compared to onload event
Q4 .What selector and filter are used for?
- Used to extract information from dom.
- Selectors are used to select parts of the Web page using common Css-style syntax.
- For example $(“p”) will select all paragraph tags in dom
- Filters are used to further refine the result got dom the selectors
- For example, $(“p:first”) will select the first paragraph in the returned value from $(“p”)
Q5. How create new content using Jquery on page?
- Define html Tag using $ or jQuery
example $(“<P>”) - Use Append keyword to add data
example $(“<p>”).appended(“Hello world) - Select element on page add the content using html keyword
example $(“#tabledata”).html($(“<p>”).appended(“Hello world))
Q6 . What is Prepend used for?
- It is used for adding information before defined element.
Example $(“#exampleTag”).prepend(“Hello”); - in other words it become the first part of sentence.
- It will we inside the tag
Q7. What is difference between html and text?
- When we use Text it parse data as plain text.
- If we use html it will parse data as html
Q8 . How Jquery handle event?
- The Way Jquery handle event is straight forward.
- It bind and unbind
- It is mostly defined in .ready function
- It attached using ON function which means get ready for listing event
- Event can also be attached by providing right name example selector.mousenmove
Q9. Explain Ajax in Jquery?
- jQuery provides high-level wrapper function for retrieving data , working with different data types, handling errors and monitoring the Ajax process
- There 2 major way of handling Ajax
ajax(): used perform generic Ajax requests load(): loads Ajax content directly into a page element
Q10. How select all tag reference in dom using Jquery?
- We select all similar tag using selector in Jquery
- Example
$(“tageName”)
or
All paragraph tag can be selected using
$(“p”)
Q11. How to select particular css reference in dom?
- Using selector be can access all css
- Dot is require before css name
- Example
$(“.cssClassname)
Q12. Explain Jquery filter in details?
- It works in conjunction with selector.
- Following is list of some of filter
:first , :last
:even, :odd
:gt(), :lt(),:eq()
:animated()
:focus()
Q13. Explain advance selector used in Jquery?
- Some of advance filter list are as follow.
- $(“prev ~ siblings”)
Selects all “siblings” elements that comes after a “prev” element - $(“prev + next”)
Selects the “next” element if it is immediately preceded by a “prev” element. - $(“ancestor descendant”)
select “child” element that are immediate descendants of the “parent”. - $(“Parent > child”)
Select “child” elements that are immediate descendants of the “parent”.
It means provide the child which have immediate parent tag
Q14. Explain Jquery Attribute filter?
Following list of some of method used in Attribute filter :
- Contains
- Parent
- Has(tag[attribute])
- first-child
- last-of-type
Q15. How to Traverse the html in Jquery?
- Following most common method used to traverse the html
children()
Prev()
next()
parent()
find()
each()
parentsuntil()
Q16. What is statement chaining?
Call multiple function on result set in same line know as statement chaining
Q17. What are basic function used to create content on page?
.html()
.text()
are two most basic method used to create content
Q18. What function used to Insert data in page?
.append
.prepend
.appendto
.prependto
.before
.after
The above method used to insert data inside the matched to selector
Q19. How alter data in page?
Following are method used to Alter the data on page:
.wrap()
.wrapAll()
.empty()
.Remove()
.detach()
.replaceAll()
.replaceWith()
Q20. How alter attribute in Html using Jquery?
- $(“Tag”).attr(<nameof Attribute> , <value>)
- $(“Tag”).removeAttr(<name of Attribute>)
Q21. How to Add and remove event handler in Jquery ?
There many ways most basically used are:
.on()
.off()
Example
$(“#target”).on.(“click mousemove”, function());
Are the method used to attach and remove event handler in Jquery
Q22. What are property consisted across browser ?
Following are property consistent across browser :
- Target
- relatedTarget
- pageX
- pageY
- which
- metakey
Q23. What is stopProgation()?
It way to telling event stop bubbling up.
Q24. What is basic category of animation in Jquery?
Following are basic category:
.hide()
.show()
.toggle()
Q25. How to have fade effect using Jquery?
Following are function used for fading effect:
.fadeIn()
.fadeOut()
.fadeTo()
.fadeToggle()
Q26. How have sliding effect in Jquery?
Following are method used for sliding effect:
.slideDown()
.slideToggle()
.slideUp()
Q27. Explain Ajax in Jquery?
Ajax is called using $.ajax function
Parameter which are require are as follow:
- URL
- Type
- Datatype
Q28. How to define Success and failure in ajax?
- done function is called when it success. It requires function as a parameter
- .fail function is called when it fails. It requires function as parameter
Q29. What is shorthand method in Jquery?
jQuery has following shorthand method:
.get
.getJson
.getScript
.post .load
Q30. What is Life cycle of Ajax event?
Following is File cycle of Ajax:
Ajax Request Started
AjaxSend
Either it would Ajaxsucceed or Ajax failed
AjaxCompleted
Q31. What is type testing function in Jquery?
Determine the type of an object
Useful for optional parameters and validation
Example:
$.isArray(array)
$.isFunction(function)
$.isEmptyObject(object)
$.isPlainObject(object)
$.isXmlDoc(doc)
$.isNumberic(number)
$.isWindow(window)
$.type(object)
Q32. What are collection manipulation function in Jquery?
Following are parameter for manipulation:
makeArray
inArray
unique
merge
map
grep
Q33. What is getScript in Jquery?
- Convince wrapper or shorthand for $.ajax
- Execute retrieved javascript immediately
- $.getScript(url,callbackfunction)
Q34. What is pushStack function?
Pushes a new array of dom object onto jQuery stack.
Example
(“#div”).children()
Q35.What is ParseJson function?
It Turns json to javascript object.
Example
$.parseJson(jsonString)
Q36. What is extend in jQuery?
- Copy members from source object to a target object
- Not inheritance, only runtime member cloning
- Conflict will cause members to be overwritten
Q37 . How Create Custom speed property in Jquery?
- By using $.fx.speeds we can create custom property.
- Example
$.fx.speeds.fasterThenLight = 30
Here fasterThenLight is custom speed property which can we used access predefined property.
Q38. Explain custom selector if we want to Create?
By using expression we can create selector
Example
(function($) {
$.expr[‘:’]myThridrow = function(elem,idx,meta,items){
return idx%3 ==0;
}}(JQuery)
$(function() {
$(“p: myThridrow”).css(“background-color”,“red”);
});
Q39. How to Create function attached to Jquery?
- Custom function can attached to Jquery in following way
- Example
(function($) { $.MycustomLogic = function (parameter) {
//define logic here
}})(jQuery)
The above function can be called using $. MycustomLogic(“value”)
Q40. Can we override the In build function of Jquery?
Yes , we can change In build function for Jquery.
Q41. What is naming rules for Jquery plug-in?
- Should Have unique name space
- Name of plugin should be unique
- jQuery.pluginName.version.js is naming way or pattern
- Include version number inside plugin
Q42. What is basic pattern for plugin?
(function($) {
$.fn.customplugin = function()
{ return this;};})(JQuery)
Above block is self executing block
Q43. How to pass parameter to jQuery plugin?
By using extend method me pass parameter in more cleaner way.
Example
(function($) {
$.fn.customplugin = function( param)
{
var setting {};
$.fn.extend(settings, $.fn. customplugin .defautvalue, param);
return this;
};
$.fn. customplugin .defautvalue = {
A1:’1’,
A2:’2’
}
})(JQuery)
Q44. What tool do you use for performance check in jquery?
Tools
Profiler
Manual Timing
This would main tool to identify performance problem
Q45. How to access profiler in console in jQuery?
By calling console.profile() and console.profileend()
Q46. What Steps or plan needed to solve performance issue?
- Profile all usage
- Look at times , all counts to zero in on problem areas
- Use manual timing to assist in identifying problems
- profile specific function calls in isolation
- try alternate algorithms
Q47. How to increase Jquery performance?
- Use latest jQuery.
- Caching the selector
- Cache other item example length, height etc
example
var myid= $(“#myiddom”)
Q48. How work with performance with selector?
- Engine used for selector is sizzle
- It is right to left parser
- Selecting directly to point is fastest example Id, css class
- Find method is also help in fast performance
Q49. How to add data in tag’s without writing them as attribute?
- By Adding .data() method
- It is case sensitive
- Syntax
$(“#test1”).data(“Key”,”value”);
Q50. Can we store complex object like javascript object in data method?
Yes
Q51. Which keywords are reserved for Jquery and not be used with data method?
Following keywords are as follow:
Events
handle
Anything which starts with underscore
Q52. What are data events for .data() method?
Following are as followed:
getData
setData
Changedata
Q53. Explain on Method in Jquery?
- On() method has following property
- Is Replacement for bind,delegate,live
- Off() to remove the attachment
- $(“selector”).on(“click”, MyhandlerjavascriptFunction)
- $(“selector”).off(“click”);
Q54. How handle multiple event handler in on() method?
Following is a way to handle multiple event handler
- $(“selector”).on(“click hover”, MyhandlerjavascriptFunction)
- $(“selector”).on({“click” : handle_click_event, “hover”: handle_Hover_event})
Q55. How to create fire custom event in Jquery?
- Whole div tags is provide with custom event
- $(“#mydiv”).on(“CustomEvent”,function_to_handle)
- To trigger event $(“#mydiv”).trigger(“CustomEvent”);
Q56. What is deferred object in jQuery?
- Based on CommonJs promise proposal
- Creates for a utility object
- Used mainly with asynchronous operation
Q57. What purpose of deferred object in jQuery?
- An object for holding & calling a queue of success/failure /complete callback
- Advantage over typical callback registration , its allow multiple callback registration
Q58. What is promise in jQuery?
It is similar to Deferred but it doesn’t contain reject or resolve
Q59. What is $.when function?
Purpose of $.when function is adding multiple deferred action.
Q60. What happens if there are multiple $.document defines on page how many time it will fire?
It will each time $.document is encountered.