jQuery MCQ (Multiple Choice Questions)

This set of jQuery MCQs covers key concepts like selectors, events, animations, and AJAX to help you master jQuery in web development.

1. What is jQuery?
a) A programming language
b) A text editor
c) A browser plugin
d) A JavaScript library
View Answer

2. Which of the following is not the feature of jQuery?
a) Efficient query method for finding the set of document elements
b) Expressive syntax for referring to elements in the document
c) Useful set of methods for manipulating selected elements
d) Powerful functional programming techniques is not used for operating on sets of elements as a group
View Answer

3. What is the primary advantage of using jQuery?
a) Faster server-side rendering
b) Compatibility with older browsers
c) Simplifying DOM manipulation and AJAX interactions
d) No need for HTML or CSS knowledge
View Answer

4. Which of the following is a single global function defined in the jQuery library?
a) $()
b) jQuery()
c) Queryanalysis()
d) global()
View Answer

5. Which of the following is the correct way to include jQuery in an HTML document?
a) <script src=”jquery.js”></script>
b) <script href=”jquery.js”></script>
c) <link src=”jquery.js”>
d) <script name=”jquery.js”></script>
View Answer

6. Which of the following is a factory function?
a) Queryanalysis()
b) jQuery()
c) $()
d) onclick()
View Answer

7. Which is the JavaScript code that asks for the set of all div elements in a document?
a)

 var divs = $(div);

b)

 var divs = jQuery("div");

c)

 var divs = $("div");

d)

var divs = #("div");

var divs = $("div");

8. What is the purpose of the jQuery $(document).ready() function?
a) To check if the page is completely loaded
b) To initialize CSS styles
c) To initialize jQuery
d) To check if the page is empty
View Answer

9. Which of the following is a heavily overloaded function?
a) $()
b) script()
c) jQuery()
d) Both $() and jQuery()
View Answer

10. Which of the following is a utility function in jQuery?
a) jQuery.each()
b) jQuery.noConflict()
c) jQuery.conflict()
d) jQuery.parseJSON()
View Answer

11. Which method is used to retrieve the value of an input field in jQuery?
a) .getValue()
b) .get()
c) .val()
d) .value()
View Answer

12. How can you remove an element from the DOM using jQuery?
a) .unlink()
b) .detach()
c) .remove()
d) .delete()
View Answer

13. How do you bind multiple events to a single element in jQuery?
a) .bind()
b) .combine()
c) .on()
d) .attach()
View Answer

14. Which jQuery method is used to add content at the end of an HTML element?
a) .add()
b) .append()
c) .push()
d) .merge()
View Answer

15. Which is the method that operates on the return value of $()?
a) show()
b) done()
c) click()
d) css()
View Answer

16. What does the min mean in the following JavaScript code?

<script src="jquery-1.4.2.min.js"></script>

a) Minimised version
b) Miniature
c) Minimised parameters
d) Minimum value
View Answer

17. How do you specify a CSS class to an element in jQuery?
a)

$('#element').addClass('className')

b)

$('#element').setClass('className')

c)

$('#element').setClass()

d)

$('#element').addStyle('className')

18. Which of the following is an equivalent replacement of $(document).ready(f)?
a) jQuery(f)
b) #(f)
c) $(f)
d) read(f)
View Answer

19. Which method is commonly used to send an AJAX GET request in jQuery?
a) .post()
b) .send()
c) .ajax()
d) .get()
View Answer

20. Which method allows you to dynamically change an element’s CSS properties in jQuery?
a) .style()
b) .color()
c) .css()
d) .change()
View Answer

21. Which of the following is used for parsing JSON text?
a) jQuery.parseJSON()
b) jQuery.each()
c) jQuery.noConflict()
d) jQuery.conflict()
View Answer

22. What does the $(this).css() method do?
a) Changes the entire CSS of the page
b) Changes the background color of the page
c) Retrieves the current CSS of the page
d) Changes the CSS of the selected element
View Answer

23. Which method in jQuery is used to find the closest parent element matching a selector?
a) .closest()
b) .ancestor()
c) .locate()
d) .near()
View Answer

24. Why would you use jQuery instead of plain JavaScript?
a) Better browser compatibility
b) Simplified syntax for DOM manipulation and AJAX calls
c) Built-in animation and effects
d) All of the mentioned
View Answer

25. Which method attaches a click event to an HTML button element?
a) .addEvent()
b) .bindClick()
c) .click()
d) .attachEvent()
View Answer

26. How do you handle errors in an AJAX call in jQuery?
a) .onError()
b) .catch()
c) .errorHandler()
d) .fail()
View Answer

27. Which jQuery selector would you use to select all elements with the class highlight?
a) $(“.highlight”)
b) $(“*highlight”)
c) $(“#highlight”)
d) $(“highlight”)
View Answer

28. How do you remove all child elements from a selected element in jQuery?
a) .deleteAll()
b) .clear()
c) .removeAll()
d) .empty()
View Answer

29. What does the jQuery $.ajax() function do?
a) Makes an asynchronous HTTP request
b) Makes a synchronous HTTP request
c) Makes a request to the database
d) Makes a request to the server and returns the result synchronously
View Answer

30. What does the .wrap() method in jQuery do?
a) Wraps the selected element with a new div
b) Wraps the selected element inside a modal window
c) Wraps the selected element in another element
d) Adds content to the selected element
View Answer

31. What will the following jQuery code do?

$('#myButton').click(function()
{
  alert('Button clicked!');
});

a) Displays an alert when the page loads
b) Displays an alert when the button with id=”myButton” is clicked
c) Hides the button when clicked
d) Displays the button with the text “Button clicked!”
View Answer

32. What will be the output of this jQuery code?

$('#myDiv').css('background-color', 'red');

a) Changes the background color of the page to red
b) Changes the text color of the div with id=”myDiv” to red
c) Hides the div with id=”myDiv”
d) Changes the background color of the div with id=”myDiv” to red
View Answer

33. What is the purpose of the following jQuery code?

$('#myDiv').slideDown();

a) Hides the #myDiv element
b) Toggles the visibility of the #myDiv element
c) Shows the #myDiv element by sliding it down
d) Changes the background color of #myDiv
View Answer

34. What does this jQuery code do?

$('#myInput').val('New Value');

a) Changes the placeholder of the input field with id=”myInput”
b) Sets the value of the input field with id=”myInput” to “New Value”
c) Sets the background color of the input field with id=”myInput”
d) Clears the value of the input field with id=”myInput”
View Answer

35. What will be the outcome of the following jQuery code?

$('.item').click(function()
{
  $(this).hide();
});

a) Hides the first .item element
b) Hides the clicked .item element
c) Shows the .item element
d) Displays an alert when any .item element is clicked
View Answer

36. Which symbol is used to select a class in jQuery?
a) #
b) .
c) *
d) %
View Answer

37. Which jQuery method creates a fade-in effect?
a) .animate()
b) .scroll()
c) .fadeIn()
d) .move()
View Answer

38. How do you perform an AJAX POST request in jQuery?

$.ajax({
    type: "POST",
    url: "data.php",
    data: { name: "John" }
});

a) .ajax()
b) .submit()
c) .get()
d) .update()
View Answer

39. Which of the following is used to load an external HTML file into a specified HTML element using jQuery?
a) .append()
b) .get()
c) .ajax()
d) .load()
View Answer

40. What does the jQuery selector $(“div p”) do?
a) Selects all <div> elements
b) Selects all <p> elements inside a <div>
c) Selects all <div> and <p> elements
d) Selects all <div> elements with a p class
View Answer

41. What does the jQuery method .each() do?
a) Adds a new class to elements
b) Changes the CSS of elements
c) Loops through each selected element
d) Selects the first element
View Answer

42. Which of the following events does jQuery not support?
a) .dblclick()
b) .keydown()
c) .scroll()
d) .click()
View Answer

43. How do you trigger an event manually in jQuery?
a) .triggerEvent()
b) .trigger()
c) .manual()
d) .fire()
View Answer

Sanfoundry Global Education & Learning Series – Javascript Programming.