JQuery Quiz - MCQ - Multiple Choice Questions

Welcome to the jQuery Quiz for beginners! Test your basic understanding of this powerful JavaScript library. As one of the most utilized libraries in web development, mastering jQuery fundamentals can supercharge your skills. This quiz is designed to challenge your knowledge and ensure you're familiar with JQuery core concepts and it's functions.

1. What does jQuery stand for?

A. Java Query

B. JavaScript Quotient

C. JavaScript Quick

D. JavaScript Query

Answer:

D. JavaScript Query

Explanation:

jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and AJAX interactions for rapid web development.

2. Which symbol is used as a shortcut for jQuery?

A. %

B. ?

C. $

D. !

Answer:

C. $

Explanation:

$ is used as a shortcut for jQuery.

3. To check if an element is hidden in jQuery, which method can be used?

A. isVisible()

B. isDisplay()

C. isHidden()

D. is(':hidden')

Answer:

D. is(':hidden')

Explanation:

The is(':hidden') method checks if an element is hidden.

4. Which jQuery method is used to set one or more style properties for selected elements?

A. style()

B. htmlStyle()

C. css()

D. setStyle()

Answer:

C. css()

Explanation:

The css() method is used to set one or more style properties for selected elements.

5. How can we get the text inside an element using jQuery?

A. innerText()

B. html()

C. getValue()

D. text()

Answer:

D. text()

Explanation:

The text() method gets the combined text contents of each element in the set of matched elements.

6. In jQuery, how can we get the value of an attribute?

A. attr()

B. getAttribute()

C. getAttr()

D. valAttr()

Answer:

A. attr()

Explanation:

The attr() method is used to get the value of an attribute for the first element in the set of matched elements.

7. Which method in jQuery is used to insert content at the end of selected elements?

A. appendTo()

B. insertEnd()

C. endInsert()

D. addEnd()

Answer:

A. appendTo()

Explanation:

The appendTo() method inserts content at the end of the selected elements.

8. What does the fadeIn() method in jQuery do?

A. Hides the selected elements by fading them to transparent.

B. Displays an element by fading it to opaque.

C. Makes the element blink.

D. None of the above.

Answer:

B. Displays an element by fading it to opaque.

Explanation:

The fadeIn() method gradually changes the opacity, for selected elements, from hidden to visible (fading effect).

9. How can you retrieve the content of a selected item in jQuery?

A. jQuery.content()

B. jQuery.val()

C. jQuery.get()

D. jQuery.retrieve()

Answer:

B. jQuery.val()

Explanation:

The val() method in jQuery is used to get the current value of the first element in the set of matched elements.

10. How do you add a class to an element in jQuery?

A. addClass()

B. insertClass()

C. appendClass()

D. setClass()

Answer:

A. addClass()

Explanation:

The addClass() method adds specified class(es) to each element in the set of matched elements.

11. Which of the following methods is used to remove specific form elements?

A. detach()

B. delete()

C. remove()

D. eliminate()

Answer:

C. remove()

Explanation:

The remove() method in jQuery removes the set of matched elements from the DOM.

12. How can you test if an element exists in the DOM?

A. Using jQuery.exists()

B. Checking $(selector).length > 0

C. Using element.isPresent()

D. Checking $(selector) !== null

Answer:

B. Checking $(selector).length > 0

Explanation:

In jQuery, if an element exists in the DOM, its length property will return a value greater than 0.

13. What is the difference between $(document).ready() and window.onload?

A. They are the same thing.

B. window.onload only works for HTML documents, not XML.

C. $(document).ready() is executed when the HTML DOM is loaded, while window.onload is executed when the page and all its resources are loaded.

D. window.onload is a jQuery event, while $(document).ready() is a native JavaScript event.

Answer:

C. $(document).ready() is executed when the HTML DOM is loaded, while window.onload is executed when the page and all its resources are loaded.

Explanation:

$(document).ready() ensures the readiness of the DOM of the page. window.onload ensures that images, scripts, and other assets are loaded.

14. Which method is used to attach an event handler to an element, but only once?

A. .one()

B. .attach()

C. .bindOnce()

D. .singleEvent()

Answer:

A. .one()

Explanation:

The .one() method attaches an event handler that will execute only once.

15. What does the .end() method do in jQuery?

A. Stops the chaining of methods.

B. Ends a running animation early.

C. Exits the jQuery script.

D. Reverts the most recent destructive action.

Answer:

D. Reverts the most recent destructive action.

Explanation:

The .end() method in jQuery ends the most recent filtering operation in the current chain and returns the set of matched elements to its previous state.

16. What does the .eq() method in jQuery do?

A. Compares two elements for equality.

B. Returns the element with the specified index from a set of matched elements.

C. Executes a function for every element in a set.

D. Checks if any of the selected elements have the specified class.

Answer:

B. Returns the element with the specified index from a set of matched elements.

Explanation:

The .eq() method reduces the set of matched elements to the one at the specified index.

17. Which jQuery method is used to prevent the execution of the default function of the event?

A. .preventDefault()

B. .stopDefault()

C. .halt()

D. .blockEvent()

Answer:

A. .preventDefault()

Explanation:

The .preventDefault() method prevents the browser's default action associated with the event.

18. How do you bind multiple events to an element in jQuery?

A. Using multiple .on() methods.

B. Using .multiBind()

C. Passing multiple events to the .on() method separated by spaces.

D. Binding one event at a time.

Answer:

C. Passing multiple events to the .on() method separated by spaces.

Explanation:

Multiple events can be bound to an element by passing them to the .on() method separated by spaces.

19. Which of the following correctly retrieves the value of an input box using jQuery?

A. $('input').getValue()

B. $('input').val()

C. $('input').inputValue()

D. $('input:text').getText()

Answer:

B. $('input').val()

Explanation:

The .val() method in jQuery gets the current value of the first element in the set of matched elements.

20. How can you hide all the paragraphs using jQuery?

A. $("p").hidden()

B. $("p").visibility("hidden")

C. $("p").hide()

D. document.querySelectorAll("p").style.display = "none"

Answer:

C. $("p").hide()

Explanation:

The .hide() method in jQuery hides the matched elements.

21. Which jQuery method is used to switch between adding/removing one or more classes (toggles) from selected elements?

A. .switchClass()

B. .toggleClass()

C. .flipClass()

D. .alternateClass()

Answer:

B. .toggleClass()

Explanation:

The .toggleClass() method toggles between adding and removing one or more class names from the selected elements.

22. How can you check if a checkbox is checked using jQuery?

A. $("input[type='checkbox']").isChecked()

B. $("input[type='checkbox']").is(":checked")

C. $("input[type='checkbox']").checkStatus()

D. $("input[type='checkbox']").value("checked")

Answer:

B. $("input[type='checkbox']").is(":checked")

Explanation:

The .is(":checked") method is used in jQuery to check if a checkbox is checked.

23. What does the .ajax() method in jQuery do?

A. It makes synchronous requests to the server.

B. It retrieves data from the server asynchronously.

C. It reloads the current page.

D. It creates a new XMLHttpRequest object.

Answer:

B. It retrieves data from the server asynchronously.

Explanation:

The .ajax() method in jQuery is used to make asynchronous HTTP requests.

24. How can you chain multiple methods in jQuery for a cleaner code?

A. Separate each method with a comma.

B. Write each method on a new line.

C. Use the then keyword between methods.

D. Separate each method with a dot.

Answer:

D. Separate each method with a dot.

Explanation:

In jQuery, you can chain multiple methods by separating each method with a dot.

25. Which of the following will select all img elements with an alt attribute containing the word "nature"?

A. $("img[alt*='nature']")

B. $("img[alt^='nature']")

C. $("img[alt='nature']")

D. $("img[alt$='nature']")

Answer:

A. $("img[alt*='nature']")

Explanation:

The * selector in jQuery selects elements whose attribute value contains a specified value.