- jQuery Events
- jQuery click() event.
- jQuery dblclick() event.
- jQuery mouseenter() event.
- jQuery mouseleave() event.
- jQuery mousedown() event.
- jQuery mouseup() event.
- jQuery hover() event.
- jQuery focus() and blur() events.
JQUERY Interview Questions with Answers,Multiple choice,Tutorials pdf free Download for freshers experienced
Showing posts with label Jquery Interview Questions with Answers. Show all posts
Showing posts with label Jquery Interview Questions with Answers. Show all posts
Name the 5 Jquery events?
Can we use our own specific charactor in the place of $ sigh in Jquery?
ANS :- Yes
You can also create your own shortcut very easily. The noConflict() method returns a reference to jQuery, that you can save in a variable, for later use. Here is an example
var kk= $.noConflict();
kk(document).ready(function () {
kk("button").click(function () {
kk("p").text("jQuery is still working!");
});
});
You can also create your own shortcut very easily. The noConflict() method returns a reference to jQuery, that you can save in a variable, for later use. Here is an example
var kk= $.noConflict();
kk(document).ready(function () {
kk("button").click(function () {
kk("p").text("jQuery is still working!");
});
});
What is the use of jquery load() method?
ANS :- The jQuery load() method is a powerful AJAX method.
The load() method loads data from a server and puts the returned data into the selected element without reload the complate page.
Ex:The following example loads the content of the file "demo_test.txt" into a specific <div> element
$("#div1").load("demo_test.txt");
The load() method loads data from a server and puts the returned data into the selected element without reload the complate page.
Ex:The following example loads the content of the file "demo_test.txt" into a specific <div> element
$("#div1").load("demo_test.txt");
What is the use of attr() method in Jquery?
ANS :- The attr() method sets or returns attributes and values of the selected elements.
When this method is used to return the attribute value, it returns the value of the first matched element.
When this method is used to set attribute values, it sets one or more attribute/value pairs for the set of matched elements.
$(selector).attr(attribute) //it will return the value of an attribute
$(selector).attr(attribute,value) //it will set the value of an attribute
$(selector).attr({attribute:value, attribute:value,...}) //for set multiple attribute
When this method is used to return the attribute value, it returns the value of the first matched element.
When this method is used to set attribute values, it sets one or more attribute/value pairs for the set of matched elements.
$(selector).attr(attribute) //it will return the value of an attribute
$(selector).attr(attribute,value) //it will set the value of an attribute
$(selector).attr({attribute:value, attribute:value,...}) //for set multiple attribute
Name the Jquery methods which are used for apply css class?
$("#Id1").addClass('YourClassName'); // for apply class
$("#Id1").removeClass('YourClassName'); // for remove class
$("#Id1").removeClass('YourClassName'); // for remove class
If you have a table, how you will apply the two differt color on alternate rows using Jquery?
<table border="1"> <tr><td>kk</td></tr>
<tr><td>SB</td></tr>
<tr><td>Avi</td></tr>
<tr><td>SN</td></tr>
</table>
Ans :
<script>
$(document).ready(function () {
$("tr:even").css("background-color", "#f4f4f8");
$("tr:odd").css("background-color", "#ffffff");
});
</script>
<tr><td>SB</td></tr>
<tr><td>Avi</td></tr>
<tr><td>SN</td></tr>
</table>
Ans :
<script>
$(document).ready(function () {
$("tr:even").css("background-color", "#f4f4f8");
$("tr:odd").css("background-color", "#ffffff");
});
</script>
Write the code for setting datetimepicker on textbox click.
If below is our textbox
<input type="text" id="Text1" name=%26quot%3Bacc%26quot%3B value="Select Date" /> then Jquery code will be
$("#abc").datepicker();
<input type="text" id="Text1" name=%26quot%3Bacc%26quot%3B value="Select Date" /> then Jquery code will be
$("#abc").datepicker();
How check currently loaded jQuery UI version on the page?
// Returns jQuery UI version (ex: 1.8.2) or undefined
$.ui.version
$.ui.version
How to check Jquery UI loaded or not?
// Checking if jQuery UI is loaded or not
if ($.ui) {
// jQuery UI is loaded
} else {
// jQuery UI is not loaded
}
if ($.ui) {
// jQuery UI is loaded
} else {
// jQuery UI is not loaded
}
What are Features of 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
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
What is jQuery & its significance? Why it is so popular?
jQuery is lightweight, client side script JavaScript library file that supports all browsers.Query is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery makes it easy to play with the DOM, add effects, and execute Ajax requests.
This helps developer to reduce lines of code while he program. For example huge code written in Java Script, can be done easily with JQuery in one or two lines as it uses pre compiled JavaScript library internally. For example To find a Div that have class xxx we can do this using custom JavaScript by looping through all DOM elements, Find Div element write if statement checking the class then write the code to manipulate cross browser. But this can be achieved using jQuery with 2 lines of code. jQuery is a fun library to use and play.
It is so popular due to the below 10 reasons.
Hence jQuery is definitely faster, easier and more productive than previous traditional JavaScript that we use, hence its so popular.
Now the Client side development is fun using jQuery Agree or not ??
This helps developer to reduce lines of code while he program. For example huge code written in Java Script, can be done easily with JQuery in one or two lines as it uses pre compiled JavaScript library internally. For example To find a Div that have class xxx we can do this using custom JavaScript by looping through all DOM elements, Find Div element write if statement checking the class then write the code to manipulate cross browser. But this can be achieved using jQuery with 2 lines of code. jQuery is a fun library to use and play.
It is so popular due to the below 10 reasons.
- Cross Browser Compatibility.
- Fast but micro Famework.The jQuery core library minified is only about 24KB in size, so it is very easily to include in any application and it is pretty fast as well.
- Easy to learn and flexible.
- It is well documented.
- Reuse of plug-ins across projects .These plug ins are extendable.
- Latest CSS Complaint.
- Microsoft, which now includes jQuery with its MVC framework and integrated to VS2010 with intellisense support .
- IBM, Netflix use jQuery. Nokia have adopted it. Google uses and hosts the jQuery library.
- Easy to find support since there is a large development community and variety of plug-ins.
- DOM manipulation with querying and chaining is Wonderful & Robust. It is simple, concise and clear enough.
Hence jQuery is definitely faster, easier and more productive than previous traditional JavaScript that we use, hence its so popular.
Now the Client side development is fun using jQuery Agree or not ??
What is Chaining in jQuery?
In jQuery, Chaining means to connect multiple functions, events on selectors. look at Sample Code 1 and 2.
$(document).ready(function(){
$('#dvContent').addClass('dummy');
$('#dvContent').css('color', 'red');
$('#dvContent').fadeIn('slow');
});
$(document).ready(function(){
$('#dvContent').addClass('dummy')
.css('color', 'red')
.fadeIn('slow');
});
Both the sample codes above will perform the exact same thing but the only difference is that Sample code 2 is using Chaining. But Code 2 is faster and shorter then Code 1.
The problem with the Sample Code 1 is that for every statement, jQuery has to search the entire DOM and find the element and after that executes the attached function on it. But when chaining is used, then jQuery has to find the element only once and it will execute all the attached functions one by one. This is the advantage of Chaining.
$(document).ready(function(){
$('#dvContent').addClass('dummy');
$('#dvContent').css('color', 'red');
$('#dvContent').fadeIn('slow');
});
$(document).ready(function(){
$('#dvContent').addClass('dummy')
.css('color', 'red')
.fadeIn('slow');
});
Both the sample codes above will perform the exact same thing but the only difference is that Sample code 2 is using Chaining. But Code 2 is faster and shorter then Code 1.
The problem with the Sample Code 1 is that for every statement, jQuery has to search the entire DOM and find the element and after that executes the attached function on it. But when chaining is used, then jQuery has to find the element only once and it will execute all the attached functions one by one. This is the advantage of Chaining.
What are the advantages of using jQuery over JavaScript in ASP.NET web application
ANS :- Below are the advatages of using jQery over JavaScript
a. Jquery is well written optimised javascript code so
it will be faster in execution unless we write same standard optimised javascript code.
b. Jquery is concise java script code ,means minimal ammount of code
is to be written for the same functionality than the javascript.
c. Javascript related Development is fast using Jquery because most of the
functionality is already written in the library and we just need to use that.
d. Jquery has cross browser support ,so we save time for supporting all the browsers.
a. Jquery is well written optimised javascript code so
it will be faster in execution unless we write same standard optimised javascript code.
b. Jquery is concise java script code ,means minimal ammount of code
is to be written for the same functionality than the javascript.
c. Javascript related Development is fast using Jquery because most of the
functionality is already written in the library and we just need to use that.
d. Jquery has cross browser support ,so we save time for supporting all the browsers.
Write the code for select second last div element?
ANS :- Code for second last div : $("div.questions > div::nth-last-child(2)").css("color", "green");
<!-- Introduced in CSS3 -->
<!-- Introduced in CSS3 -->
Write the code for selecting the
1st div element, 4th div element
last div, and for even and odd div elemets also.
one by one?
apply the red color on the above div.
<div class="questions">
<div class="box"> Question</div>
<div class="box"> Question</div>
<div class="box"> Question</div>
<div class="box"> Question</div>
<div class="box"> Question</div>
<div class="box"> Question</div>
</div>
Code for first div : $("div.questions > div:first").css("color", "green");
Code for 4th div : $("div.questions > div:nth-child(4)").css("color", "green");
Code for last div : $("div.questions > div:last").css("color", "green");
Code for even div : $("div.questions > div:even").css("color", "green");
Code for odd div : $("div.questions > div:odd").css("color", "green");
last div, and for even and odd div elemets also.
one by one?
apply the red color on the above div.
<div class="questions">
<div class="box"> Question</div>
<div class="box"> Question</div>
<div class="box"> Question</div>
<div class="box"> Question</div>
<div class="box"> Question</div>
<div class="box"> Question</div>
</div>
Code for first div : $("div.questions > div:first").css("color", "green");
Code for 4th div : $("div.questions > div:nth-child(4)").css("color", "green");
Code for last div : $("div.questions > div:last").css("color", "green");
Code for even div : $("div.questions > div:even").css("color", "green");
Code for odd div : $("div.questions > div:odd").css("color", "green");
Subscribe to:
Posts (Atom)