You think you know jQuery?

Website: http://tutorialzine.com/quizzes/take/1/

What does the function $(‘.selector’) return?
Ans: A new jQuery object.

Why do we usually add our jQuery code to the document.ready event?
$(document).ready(function(){
// do something
});
Ans: The document.ready event is fired when the DOM is initialized, and we can access all the elements on the page with jQuery selectors. We use it because this is the earliest time in the loading of the page that we can execute jQuery code safely.

What do we use jQuery.noConflict() for?
Ans: To restore the ‘$’ to its previous, non-jQuery owner. This way we can have more than one JavaScript library on the page.

Why do we usually add the stop() method before calling animate()? – WRONG
Ans:

How can you tell if an element is currently being animated?
Ans:
if($(‘#myDiv’).is(‘:animated’)){
// do stuff
}

What is Sizzle?
Ans: An open source JavaScript library, that is embedded inside jQuery, and handles the CSS-like selection of elements from the DOM.

What is the difference between .width() and .outerWidth()?
Ans: width() returns the computed width of the element, while outerWidth() returns the width plus all the margins and paddings.

What does the filter() method do in the following line?
$(‘div’).filter(‘.nav’)
Ans: It sifts through all the divs and leaves only those which have the nav class.

How do you fetch the first span on the page, which has the class ‘green’?
Ans: $(‘span.green:first’)

What does the $(‘#myDiv’).hover() method do? – WRONG
Ans: It binds the functions you pass as parameters, to the mouseenter and mouseleave events.

What actually happens when we write something like this: – WRONG
$(‘#myDiv’).find(‘span’).addClass(‘color’,’red’).width(200);
Ans: The dollar function creates a new jQuery object. Every method from then on returns that same object modifying it if necessary. This is called chaining.

If you want to make the #myDiv element 200px wide and 100px tall, can you do this:
$(‘#myDiv’).width(200).height(100);
Ans: Yes you can. When acting as setters, width and height return the jQuery object.

What does the end() method do in this chain? – WRONG
$(‘#myDiv’).find(‘span’).hide().end().addClass(‘.spansHidden’);
Ans: It restores the jQuery object to the state it was before being modified by find(‘span’). This way .addClass(‘.spansHidden’) is applied directly to #myDiv.

Which of the snippets below creates a new div and appends it to the first span on the page?
Ans:
$(‘<div>’,{
html:”This is a new <b>div</b>”
}).appendTo(‘span:first’);

Why doesn’t this work:
$(‘p’).click(function(){
this.html(‘clicked!’);
});
Ans: All event listening functions are passed the element, and not the jQuery object. For this to work, the second line has to become $(this).html(‘clicked!’);

What is the difference between – WRONG
$(‘#myDiv’).bind(‘click’,function(){
// do something
});
and
$(‘#myDiv’).click(function(){
// do something
});
Ans: There is no difference. They do the same.

Can we do this:    – WRONG
$(‘#myDiv’).bind(‘myEvent’,function(){
// do something
});
Ans: Yes, we can bind custom events.

Which of the snippets below can listen for events on elements that are yet to be created?
Ans:
$(‘div.green’).live(‘click’,function(){
// do stuff
});

$(‘#myDiv’).trigger(‘click’);
Ans: It simulates a click on the element and runs all the event handlers associated with it.

Which of the below is equivalent to    – WRONG
if($(‘#myDiv’).hasClass(‘purple’)){
// do stuff
}
Ans: if($(‘#myDiv’).is(‘.purple’)){
// do stuff
}

Why do we add a return false here?
$(‘form.contact’).submit(function(e){
// submit the form via AJAX
return false;
});
Ans: return false prevents the web browser from submitting the form and reloading the page.

What does the serialize() method do in the following line?    – WRONG
$(‘#myForm’).serialize();
Ans: It fetches the names and values of all the input fields contained in the form, and generates a URL encoded string representation, ready to be submitted via AJAX or appended to a URL.

What does the $.get() jQuery function do?
Ans: It fires a GET AJAX request.

What does $(‘#myDiv’).load(‘page.html’) do?
Ans: It fires an AJAX request, fetches the result of page.html as text, and inserts it into the div.

What is the difference between $(‘#element’).remove() and $(‘#element’).detach()
Ans: remove() removes the element from the DOM along with any jQuery data such as event handlers, while detach() only removes the element from the DOM.

69%
Congrats! You answered 18 questions correctly, from a total of 26

About selvam4win

I am Selvam. I am very jolly person and frank one.

Posted on August 9, 2011, in jQuery, Quiz and tagged , . Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: