jQuery Quiz Questions 11-20

Sam Deering
Tweet

Following on from jQuery Quiz Questions 1-10 here are questions 11-20. Hopefully you might learn something new about jQuery you didn’t know before. Once more if you find any mistakes please feel free to leave a comment with corrections. Enjoy!

Question 11

Which of the following is the correct way to check which key was pressed using jQuery?

Answers

  • $('#txtValue').keypress(function (event) {
        $('#txtvalue').alert((event.keyCode));
    });
    
  • $(‘#txtValue’).keypress(function (event) {
        alert(String.fromCharCode((event.keyCode)));
    });
    
  • $(‘#txtValue’).keypress(function (event) {
        alert(fromCharCode((event.keyCode)));
    });
    
  • $(‘#txtValue’).keypress(function (event) {
        $(‘#txtvalue’).alert((event.which));
    });
    

Correct Answer

$(‘#txtValue’).keypress(function (event) {
    $(‘#txtvalue’).alert((event.which));
});

API: http://api.jquery.com/keypress/

 


Question 12

Consider the following code snippet:

$('#ul1 li').on('click', function1);
$('#ul1').after('
  • Last item
  • ');

    Is function1 executed if “lastLi” is clicked?

    Answers

    • yes
    • no

    Correct Answer
    no. The .after() function adds the list item outside the UL tag.

     


    Question 13

    $("ul#myId > li");

    What does the above statement return?

    Answers

    • A set of tags whose id is “li”.
    • A set of tags which contains class “li”.
    • A set of li tags which are children of ul tags that have “myId” class.
    • A set of li tags which are children of ul tags that have “myId” id.

    Correct Answer
    A set of li tags which are children of ul tags that have “myId” id.

     


    Question 14

    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, …) have class firstRowClass
    • the rows of table1 at order 3n (n = 1, 2, …) have class firstRowClass
    • all rows of table1 have class firstRowClass
    • no rows of table1 have class firstRowClass

    Correct Answer
    the rows of table1 at order 3n + 1 (n = 0, 1, 2, …) have class firstRowClass
    see answer in action: http://jsfiddle.net/jquery4u/zJW3B/

     


    Question 15

    Which of the following is the correct way to move an element into another element?

    Answers

    • $('#source').prependTo('#destination');
    • $("#source").add("#destination");
    • $("#source").html("#destination");
    • $("#source").add().html().("#destination");

    Correct Answer

    $("#source").add("#destination");

     


    Question 16

    Consider the following code snippet:

    $('span.item').each(function (index) {
        $(this).wrap('<li>Item</li>');
    });
    

    Essentially, 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 Item into each span that has item class.
    • Replaces each span tag that has class item with a
    • Item
    • .

    Correct Answer
    Wraps each span tag that has class item within a li tag.
    see answer in action: http://jsfiddle.net/jquery4u/gv2vq/

     


    Question 17

    What is the result of the following code snippet?

    jQuery.unique([1, 2, 2, 3, 3, 1]);
    

    Answers

    • [1, 2, 3].
    • [3, 2, 1].
    • [1, 1, 2, 2, 3, 3].
    • None of the above.

    Correct Answer
    [1, 2, 3].
    see answer in action: http://jsfiddle.net/jquery4u/gkJsP/

     


    Question 18

    Consider the following code snippet:

    $('#table1').find('tr').hide().slice(10, 20).show();
    

    What is the result of this code snippet?

    Answers

    • Showing table1’s rows from 11th to 20th.
    • Showing table1’s 20 rows from 10th.
    • Deleting rows of table1 from 10th to 20th.
    • Deleting 20 rows of table1 from 10th onward.

    Correct Answer
    Showing table1’s rows from 11th to 20th.
    see answer in action: http://jsfiddle.net/jquery4u/MQjer/

     


    Question 19

    $("div").find("p").andSelf().addClass("border");
    

    The statement adds class border to ___.

    Answers

    • all p tags enclosed in div tag
    • all div tags and p tags in div tags
    • all div tags
    • all p tags

    Correct Answer
    all div tags and p tags in div tags
    see answer in action: http://jsfiddle.net/jquery4u/eUBup/

     


    Question 20

    Which of the following statements return(s) a set of p tags that contain “jQuery”?

    Answers

    1. $('p:contains(jQuery)');
    2. $('p:contains("jQuery")');
    3. $('p:has("jQuery")');
    4. 1 and 2
    5. 1 and 3

    Correct Answer
    1 and 2
    see answer in action: http://jsfiddle.net/jquery4u/cAnHC/

     

    Free JavaScript: Novice to Ninja Sample

    Get a free 32-page chapter of JavaScript: Novice to Ninja and receive updates on exclusive offers from SitePoint.

    • Bob Jones

      Question 16 didn’t format right ;) Thanks!

      • http://jquery4u.com/ jQuery4u

        Fixed thanks Bob.

    • Bob Jones

      Question 17’s jsfiddle is showing

      [1, 2, 3, 1] not [3, 2, 1]
      … weird!

      • http://jquery4u.com/ jQuery4u

        Fixed. My bad correct answer is obviously [1,2,3]

        • Bob Jones

          Still not quite right… apparently the array has to be sorted first for the expected result.

          Check out my modified code: http://jsfiddle.net/gkJsP/1/

          console.log(jQuery.unique([1, 2, 2, 3, 3, 1, 1, 4, 1]));
          >>[1, 2, 3, 1, 4, 1]

          • http://jquery4u.com/ jQuery4u

            Only for correct sequence it needs to be sorted. It naturally picks the first one.

    • Alessandro

      I like this kind of posts, I was wondering if there was something similar more related to real development issues based on real projects. Thanks