oDesk JQuery Test Answers 2015
·
1. How can the href for a hyperlink be
changed using jQuery?
Answers:
•
$("a").link("http://www.google.com/");
• $("a").change("href","http://www.google.com/");
•
$("a").link("href","http://www.google.com/");
•
$("a").attr("href", "http://www.google.com/");
2. The position function gets the ___
positions of an element that are relative to its offset parent.
Answers:
• top and left
• top and right
• bottom and left
• bottom and
right
3. Consider the following code
snippet:
<ul id='id1'>
<li id='li1'>Items
1</li>
<li id='li2'>Items
2</li>
<li id='li3'>Items
3</li>
</ul>
Which of the following code snippets
returns the same result as $('#id1 li').not($('#li2'));?
Answers:
• $('#li2').siblings();
•
$('#id2').siblings('#li2');
•
$('#li2').children();
•
$('#id2').children('#li2');
4. Which of the following is the
correct way to debug JavaScript/jQuery event bindings with Firebug or a similar
tool?
Answers:
• var clickEvents =
$('#foo').data("events").click; jQuery.each(clickEvents,
function(key, value) { console.log(value) // prints "function() {
console.log('clicked!') }" })
•
$.fn.listHandlers = function(events, outputFunction) { return
this.each(function(i){ var elem = this, dEvents = $(this).data('events'); if
(!dEvents) {return;} $.each(dEvents, function(name, handler){ if((new RegExp('^('
+ (events === '*' ? '.+' : events.replace(',','|').replace(/^on/i,'')) + ')$'
,'i')).test(name)) { $.each(handler, function(i,handler){ outputFunction(elem,
'\n' + i + ': [' + name + '] : ' + handler ); }); } }); }); };
• var clickEvents
= $('#foo').data("events").click; jQuery.each(clickEvents,
function(key, value) { event.console.log(value); })
•
$.fn.listHandlers = function(events, outputFunction) { return
this.each(function(i){ var elem = this, dEvents = $(this).data('events');
$.each(dEvents, function(name, handler){ if((new RegExp('^(' + (events === '*'
? '.+' : events.replace(',','|').replace(/^on/i,'')) + ')$' ,'i')).test(name))
{ $.each(handler, function(i,handler){ outputFunction(elem, '\n' + i + ': [' +
name + '] : ' + handler ); }); } }); }); };
5. Which of the following events can
be used to disable right click contextual menu?
Answers:
• contextmenu
• contextualmenu
• rightclickmenu
• The right-click
contextual menu cannot be disabled.
6. Which of the following gets the
href attribute of "id1"?
Answers:
• $('#id1).attr('href');
•
$('#id1').getAttribute('href');
•
$('#id1)[0].attr('href');
• All of these.
7. Which of the following is the
correct way to manage a redirect request after a jQuery Ajax call?
Answers:
• $.ajax({ type:
"POST", url: reqUrl, data: reqBody, dataType: "json",
success: function(data, textStatus) { if (data.redirect) { // data.redirect
contains the string URL to redirect to window.location.href = data.redirect; }
else { // data.form contains the HTML for the replacement form
$("#myform").replaceWith(data.form); } } });
• public
ActionResult Index(){ if (!HttpContext.User.Identity.IsAuthenticated) {
HttpContext.Response.AddHeader("REQUIRES_AUTH","1"); }
return View() }
• $.ajax( error:
function (jqXHR, timeout, message) { var contentType =
jqXHR.getResponseHeader("Content-Type"); if (jqXHR.status === 200
&& contentType.toLowerCase().indexOf("text/html") >= 0) {
window.location.reload(); } });
• $(document).ready(function
() { $(document).ajaxSend( function(event,request,settings) { var
intercepted_success = settings.success; settings.success = function( a, b, c )
{ if( request.responseText.indexOf( "<html>" ) > -1 )
window.location = window.location; else intercepted_success( a, b, c ); }; });
});
8. Which of the following is the
correct way to change the image source during click event of a button in
jQuery?
Answers:
•
$("#button").click(function(){ $(“img”).src(); });
•
$("#button").click(function(){$(“img”).attr(); });
•
$("#button").submit(function(){$(“img”).text();});
•
$("#button").submit(function(){$(“img”).html(); });
9. What is the purpose of
$(document).ready() function in Jquery?
Answers:
• To execute
functions after all content and images are loaded
• To execute functions after
DOM is loaded
• To execute
functions before DOM load
• To execute
functions before content and images load
10. Which of the following will show
an alert containing the content(s) of a database selection?
Answers:
• $.ajax({ type:
"GET", url: "process_file.php?comp_id="+comp_id, success:
function (result) { alert(result); } });
• $.ajax({ type:
"GET", success: function (result) { alert(result); } });
• $.ajax({ type:
"GET", url: "process_file.php?comp_id="+comp_id, error:
function (result) { alert(result); } });
• $.ajax({ type:
"GET", url: "process_file.php?comp_id="+comp_id, Complete:
function (result) { alert(result); } });
11. How can an Ajax request that has
not yet received a response be canceled or aborted?
Answers:
• //xhr is an Ajax variable
xhr.abort()
• //xhr is an
Ajax variable xhr.cancel()
• //xhr is an
Ajax variable xhr.die()
• //xhr is an
Ajax variable xhr.destroy()
12. Consider the following code
snippet:
$('a.arrow-1').click(function () {
$('.second-row').slideUp();
$(this).parent('.first-row').siblings('.second-row').slideDown();
});
The order of the animations of this
code snippet are:
Answers:
• The targeted
parent sibling .second-row will slide up, then .second-row will slide down.
• .second-row will slide up,
then the targeted parent sibling .second-row will slide down.
• Both the
targeted parent sibling .second-row will slide down and the .second-row will
slide up actions will occur at the same time.
• None of the
above.
13. Consider the following code
snippet:
$('#ul1 li').live('click', function1);
$('#ul1').after('<li
id="lastLi">Last item</li>');
Is function1 executed if
"lastLi" is clicked?
Answers:
• Yes
• No
•
"lastLi" does not exist.
14. Which of the following code
snippets insert(s) the code snippet <font size=2><div
class="footer">footer</div></font> at the end of div
tags?
Answers:
• $('div').append('<div
class="footer">footer</div>');
•
$('div').appendTo('<div class="footer">footer</div>');
• $('<div
class="footer">footer</div>').append('div');
• $('<div
class="footer">footer</div>').appendTo('div');
15. jQuery allows you to use ___
function to switch between showing and hiding an element.
Answers:
• show
• hide
• switch
• toggle
16. What does $('tr.rowClass:eq(1)');
return?
Answers:
• One element set which is
the second row of the first table.
• One element set
which is the first row of the first table.
• A set of tr
tags which have "rowClass:eq(1)" class .
• A set of tr
tags which have "eq(1)" class .
17. Which option can be used to have
jQuery wait for all images to load before executing something on a page?
Answers:
• All jQuery code
need to add inside $function() { } syntax
• With jQuery, can use
$(document).ready() to execute something when the DOM is loaded
and$(window).load() to execute something when all other things are loaded as
well, such as the images.
• With jQuery,
can use $(document).ready() or $(window).load() syntax as these both are the
same.
•
$(window).onLoad(function() { })
18. offset function gets the current
offset of the first matched element in pixels relative to the ___.
Answers:
• document
• parent element
• children
element
• container
19. Consider the following code
snippet:
$(document).ready(function() {
$('div').each(function(index) {
alert(this);
});
});
Which of the following objects does
the 'this' variable refer to?
Answers:
• window
• document
• The current div tag of the
iteration.
• The last
element tag in the body.
20. Which of the following returns the
children tags of "id1"?
Answers:
• $('#id1').children();
•
$('#id1').getChildren();
•
children('#id1');
•
getChildren('#id1');
21. Which of the following is the
correct way to select an option based on its text in jQuery?
Answers:
• $("#myselect
option").filter(function(){ return $(this).text() ==
'text';}).prop('selected', true);
•
$("#myselect option").prop('selected', true).text("text")
•
$("#myselect").filter("option").prop('selected',
true).text("text");
•
$("#myselect").filter(function(){ return $(this).val() ==
'text';}).prop('selected', true);
22. Consider the following code
snippet:
$('#id1').animate({width:"240px"},
{ queue:false, duration:1000 }).animate({height:"320px"},
"fast");
The order of the animations of this
code snippet is ___.
Answers:
• First the width
animation, then the height animation.
• First the
height animation, then the width animation.
• Both the width animation
and the height animation occur at the same time.
• The order of
animations is random.
23. What is the result of NaN == NaN?
Answers:
• true
• false
• An error
occurs.
• None of these.
24.
$("div").find("p").andSelf().addClass("border");
The statement adds class border to
___.
Answers:
• all div tags and p tags in
div tags
• all div tags
• all p tags
• all p tags
enclosed in div tags
25. $('#a1').one('click', {times: 3},
function1);
Which of the following is true for the
above?
Answers:
• function1 will be executed
once regardless of the number of times a1 is clicked.
• function1 will
be executed at most 3 times if a1 is clicked more than twice.
• There is at
most one instance of function1 to be executed at a time.
• There are at
most three instances of function1 to be executed at a time.
26. Consider the following code
snippet:
<font size=2>
<ul id='id1'>
<li id='li1'>Items
1</li>
<li id='li2'>Items
2</li>
<li id='li3'>Items
3</li>
</ul>
</font>
Which of the following code snippets
return(s) a set of all li tags within id1 except for the li tag with id li2?
Answers:
• $('#id1
li').not($('#li2'));
• $('#id1
li').except($('#li2'));
• $('#id1
li').remove($('#li2'));
• $('#id1
li').delete($('#li2'));
27. Assume that you want that first
the tag with "id1" fades out and then the tag with "id2"
fades in. Which of the following code snippets allow(s) you to do so?
Answers:
•
$('#id1').fadeOut('fast'); $('#id2').fadeIn('slow');
•
$('#id2').fadeIn('slow'); $('#id1').fadeOut('fast');
• $('#id1').fadeOut('fast',
function() {$('#id2').fadeIn('slow')});
•
$('#id2').fadeIn('slow', function() {$('#id1').fadeOut('fast')});
28. Which of the following methods can
be used to copy element?
Answers:
• clone
• cloneTo
• move
• moveTo
29.
$('#id1').animate({width:"80%"}, "slow")
The above code snippet will ___.
Answers:
• animate the tag with id1
from the current width to 80% width.
• animate the tag
with id1 from 80% width to current width.
• animate the tag
with id1 from the current 80% width to 0px.
• animate the tag
with id1 from 80% width to 100% width.
30. Consider the following code
snippet:
<ul id='id1'>
<li id='li1'>Items
1</li>
<li id='li2'>Items
2</li>
<li id='li3'>Items
3</li>
</ul>
Which of the following code snippets
return(s) a set of all li tags within id1 except for the li tag with id li2?
Answers:
• $('#id1
li').not($('#li2'));
• $('#id1
li').except($('#li2'));
• $('#id1
li').remove($('#li2'));
• $('#id1
li').delete($('#li2'));
31. Which of the following methods can
be used to utilize the animate function with the backgroundColor style
property?
Answers:
• Use the jQuery UI library.
• There is no
need to do anything as jQuery core already supports that style property.
• There is no way
to use animate with that style property.
32. Consider the following code
snippet:
$('#id1').animate({width:"240px"},
{ queue:false, duration:1000 }).animate({height:"320px"},
"fast");
The order of the animations of this
code snippet is ___.
Answers:
• First the width
animation, then the height animation.
• First the
height animation, then the width animation.
• Both the width animation
and the height animation occur at the same time.
• The order of
animations is random.
33. Which of the following code
snippets insert(s) the code snippet
<div
class="footer">footer</div>
at the end of div tags?
Answers:
•
$('div').append('<div class="footer">footer</div>');
•
$('div').appendTo('<div class="footer">footer</div>');
• $('<div
class="footer">footer</div>').append('div');
• $('<div
class="footer">footer</div>').appendTo('div');
34. Which option is correct to perform
a synchronous AJAX request?
Answers:
• beforecreate:
function(node,targetNode,type,to) { jQuery.ajax({ url: 'http://example.com/catalog/create/'
+ targetNode.id + '?name=' + encode(to.inp[0].value), success: function(result)
{ if(result.isOk == false) alert(result.message); } }); }
• beforecreate:
function(node,targetNode,type,to) { jQuery.ajax({ url: 'http://example.com/catalog/create/'
+ targetNode.id + '?name=' + encode(to.inp[0].value), success: function(result)
{ if(result.isOk == false) alert(result.message); }, async: sync(true) }); }
• beforecreate:
function(node,targetNode,type,to) { jQuery.ajax({ url: 'http://example.com/catalog/create/'
+ targetNode.id + '?name=' + encode(to.inp[0].value), success: function(result)
{ if(result.isOk == false) alert(result.message); }, async: false }); }
• jQuery only
allow asynchronous AJAX request.
35. Which of the following is the
correct way to get "Option B" with the value '2' from following HTML
code in jQuery?
<select id='list'>
<option
value='1'>Option A</option>
<option
value='2'>Option B</option>
<option
value='3'>Option C</option>
</select>
Answers:
•
$("#list[value='2']").text();
• $("#list
option[value='2']").text();
•
$(this).find("option:selected").text();
•
element.options[element.selectedIndex].text
36. Consider the following code
snippet:
<ul id='id1'>
<li id='li1'>Items 1</li>
<li id='li2'>Items
2</li>
<li id='li3'>Items
3</li>
</ul>
Which of the following code snippets
returns the same result as $('#id1 li').not($('#li2'));?
Answers:
• $('#li2').siblings();
•
$('#id2').siblings('#li2');
•
$('#li2').children();
• $('#id2').children('#li2');
37. If jQuery is included before
another library, how can conflict between jQuery and that library be avoided?
Answers:
• By calling
jQuery.noConflict(); right after including jQuery.
• By calling
jQuery.useDefault = false; right after including jQuery.
• By calling
jQuery.useShortcut = false; right after including jQuery.
• By using the
jQuery object when working with the jQuery library and using the $ object for
other libraries.
38. Which of the following functions
is/are built-in jQuery regular expression function(s)?
Answers:
• test
• match
• find
• jQuery does not
have built-in regular expression functions.
39. each() is a generic ___ function.
Answers:
• comparator
• operator
• iterator
• normal
40. Consider the following code
snippet:
$('span.item').each(function (index) {
$(this).wrap('<li>Item</li>');
});
What does this code snippet do?
Answers:
• Wraps each span tag that
has class item within a li tag.
• Inserts each
span tag that has class item into a li tag.
• Inserts
<li>Item</li> into each span that has item class.
• Replaces each
span tag that has class item with a <li>Item</li>.
41. Consider the following code
snippet:
$(document).ready(function1);
$(document).ready(function2);
$(document).ready(function3);
Which of the following functions are
executed when DOM is ready?
Answers:
• function1
• function2
• function3
• function1, function2, and
function3
• No function is
executed.
42. Which of the following represents
the best way to make a custom right-click menu using jQuery?
Answers:
•
$(document).bind("contextmenu", function(event) {
event.preventDefault(); $("<div class='custom-menu'>Custom
menu</div>") .appendTo("body") .css({top: event.pageY +
"px", left: event.pageX + "px"}); });
•
$(document).bind("contextrightmenu", function(event) {
event.preventDefault(); $("<div class='custom-menu'>Custom
menu</div>") .appendTo("body") .css({top: event.pageY +
"px", left: event.pageX + "px"}); });
•
$(document).bind("rightclick", function(event) { event.preventDefault();
$("<div class='custom-menu'>Custom menu</div>")
.appendTo("body") .css({top: event.pageY + "px", left:
event.pageX + "px"}); });
• None of the
above.
43. Consider the following code
snippet:
$('#button1').bind('click',
function(data) {...});
What is the data argument?
Answers:
• Click event's data
• Function's data
• Global variable
• Local variable
44.
$("div").find("p").andSelf().addClass("border");
The statement adds class border to
___.
Answers:
• all div tags and p tags in
div tags
• all div tags
• all p tags
• all p tags
enclosed in div tags
45. Consider the following code
snippet:
<font size=2>
<ul id='id1'>
<li id='li1'>Items
1</li>
<li id='li2'>Items
2</li>
<li id='li3'>Items
3</li>
</ul>
</font>
Which of the following code snippets
return(s) a set of all li tags within "id1" except for li tag with id
"li2"?
Answers:
• $('#id1
li').not($('#li2'));
• $('#id1
li').except($('#li2'));
• $('#id1
li').remove($('#li2'));
• $('#id1
li').delete($('#li2'));
46. What is the result of this
function: jQuery.makeArray ( true )?
Answers:
• 1
• NaN
• [ true ]
• []
47. Which of the following is the
correct way to get the value of a textbox using id in jQuery?
Answers:
•
$(“.textbox”).text()
• $(“#textbox”).val()
• $(“.textbox”).val()
•
$(“#textbox”).text()
48. The hide() function hides an
element by ___.
Answers:
• setting
"display" inline style attribute of that element to "none".
• setting
"visibility" inline style attribute of that element to
"hidden".
• setting the
horizontal attribute of that element to "-100".
• setting the
vertical attribute of that element to "-100".
49. Consider the following code
snippet:
$('#table1').find('tr').filter(function(index)
{ return index % 3 == 0}).addClass('firstRowClass');
The result of the above code snippet
is ___.
Answers:
• The rows of table1 at
order 3n + 1 (n = 0, 1, 2,...) will belong to the class firstRowClass.
• The rows of
table1 at order 3n (n = 1, 2,...) will belong to the class firstRowClass.
• All rows of
table1 will belong to the class firstRowClass.
• No row of
table1 will belong to the class firstRowClass.
50. One advantage of $.ajax function
over $.get or $.post is that ___.
Answers:
• $.ajax offers error
callback option.
• $.ajax is
easier to use.
• $.ajax allows
passing request parameters.
• the result of
$.ajax is formatted.
51. Using an element of some kind that
is being hidden using .hide() and shown via .show(). Which of the
following is the best way to determine if that element is currently hidden or visible
on the screen?
Answers:
•
$(element).is(":visible")
•
$(this).css("visibility") == "hidden"
•
$(element).is(":invisible")
•
$(this).css("visibile") == "hidden"
52. Which of the following will get
the first column of all tables using jQuery?
Answers:
•
$('table.tblItemTemplate first-child');
•
$('table.tblItemTemplate tr:first-child');
• $('table.tblItemTemplate
td:first-child');
•
$('tabletblItemTemplate td:first-child');
53. Which option is correct to use the
below function to set cursor position for textarea?
Function:
$.fn.selectRange = function(start,
end) {
return
this.each(function() {
if (this.setSelectionRange) {
this.focus();
this.setSelectionRange(start, end);
} else if (this.createTextRange) {
var range = this.createTextRange();
range.collapse(true);
range.moveEnd('character', end);
range.moveStart('character', start);
range.select();
}
});
};
Answers:
•
$('#elem').selectRange(3,5);
•
$('#elem').selectRange(3 5);
•
$('#elem').selectRange(X:3,Y:5);
•
$('#elem').fn.selectRange(3,5);
54. Assuming that the jQuery UI
library is used to make a list sortable, which of the following code snippets
makes "list1" sortable?
Answers:
• $('#list1').sortable();
•
$('#list1').changeable();
•
$('#list1').interchangeable();
•
$('#list1').organizeable();
55. Which of the following is the
correct way to disable an input field with jQuery?
Answers:
•
$("input").attr('disabled','disabled');
•
$("input").css('disabled','disabled');
•
$("input").attr('disable','disable');
•
$("input").('disabled');
56. Which of the following functions
can be used to stop event propagation?
Answers:
• stopPropagation
•
disablePropagation
•
cancelPropagation
•
preventPropagation
57. How can the child img be selected
inside the div with a selector?
Answers:
• jQuery(this).children("img");
•
jQuery(this).find("img");
•
$(this).find("img").attr("alt")
•
$(this).children("img").attr("alt")
58. jQuery allows simulating an event
to execute an event handler as if that event has just occurred by using ___.
Answers:
• trigger function
• execute
function
• intimate
function
• jQuery does not
have this feature.
59. Which of the following is the
correct use of ajaxStart() function?
Answers:
• ajaxStart()
function is used to start ajax call.
• ajaxStart() function is
used to run some code when ajax call start.
• a & b
• None of the
above.
60. The height function returns the
height of an element in ___.
Answers:
• pixel units
• point units
• em units
• millimeter
units
61. Which of the following values
is/are valid value(s) of secondArgument in addClass('turnRed', secondArgument);
function, if the jQuery UI library is being used?
Answers:
• 'fast'
• slow
• 1000ms
• 3000
62. Consider the following code
snippet:
$('#button1').bind('click',
function(data) {...});
What is the data argument?
Answers:
• Click event's
data
• Function's data
• Global variable
• Local variable
63. Which of the following is the
correct way to add an additional option and select it with jQuery?
Answers:
•
$('#mySelect').append('<option
value="whatever">text</option>').val('whatever')
•
$('#mySelect').html('<option
value="whatever">text</option>').val('whatever')
•
$('#mySelect').text('<option
value="whatever">text</option>').val('whatever')
•
$('#mySelect').val('whatever')
