jQuery Quiz
jQuery simplifies DOM selection, events, effects and AJAX calls. Although newer tools exist, it is still found in many existing websites, so these questions cover selectors, methods, events, effects and AJAX basics.
What this quiz covers
- Selectors and DOM traversal
- Events and effects
- Manipulating content and CSS
- AJAX methods
Study tip: Compare each jQuery method with its plain JavaScript equivalent to understand what the library is doing for you.
Questions, answers and explanations
1. What is jQuery?
- A JavaScript library
- A CSS framework
- A programming language
- A database
Answer: A JavaScript library
jQuery is a fast, lightweight JavaScript library that simplifies HTML DOM manipulation, event handling, animations, and AJAX.
2. Who developed jQuery?
- Brendan Eich
- John Resig
- Evan You
- Mark Otto
Answer: John Resig
jQuery was created by John Resig in 2006.
3. Which symbol is used as a shortcut for jQuery?
- #
- $
- @
- &
Answer: $
The dollar sign ($) is the shortcut symbol used to access jQuery.
4. Which method is used to execute code after the document is fully loaded?
- $(document).ready()
- window.load()
- document.start()
- ready()
Answer: $(document).ready()
The ready() method ensures the DOM is fully loaded before running JavaScript.
5. Which method is used to hide an HTML element?
- hide()
- remove()
- display()
- invisible()
Answer: hide()
The hide() method hides selected HTML elements.
6. Which method is used to show hidden elements?
- show()
- display()
- visible()
- open()
Answer: show()
The show() method displays hidden HTML elements.
7. Which jQuery method is used to hide or show elements automatically?
- toggle()
- switch()
- flip()
- change()
Answer: toggle()
The toggle() method alternates between hiding and showing elements.
8. Which method changes the text content of an element?
- text()
- html()
- value()
- content()
Answer: text()
The text() method gets or sets the text of selected elements.
9. Which method changes the HTML content of an element?
- html()
- text()
- innerHTML()
- content()
Answer: html()
The html() method gets or sets the HTML content.
10. Which method gets or sets the value of form elements?
- val()
- text()
- value()
- input()
Answer: val()
The val() method gets or sets the value of form elements.
11. Which jQuery method adds a CSS class to an element?
- addClass()
- appendClass()
- setClass()
- classAdd()
Answer: addClass()
The addClass() method adds one or more CSS classes to selected elements.
12. Which method removes a CSS class from an element?
- removeClass()
- deleteClass()
- removeCSS()
- classRemove()
Answer: removeClass()
The removeClass() method removes one or more classes from selected elements.
13. Which method toggles a CSS class?
- toggleClass()
- switchClass()
- changeClass()
- flipClass()
Answer: toggleClass()
The toggleClass() method adds or removes a class depending on its current state.
14. Which jQuery method is used to attach a click event?
- click()
- onclick()
- mouseClick()
- eventClick()
Answer: click()
The click() method attaches or triggers a click event.
15. Which method appends content to the end of selected elements?
- append()
- prepend()
- after()
- insert()
Answer: append()
The append() method inserts content at the end of selected elements.
16. Which method inserts content at the beginning of selected elements?
- prepend()
- append()
- before()
- insertFirst()
Answer: prepend()
The prepend() method inserts content at the beginning of selected elements.
17. Which jQuery method removes selected elements from the DOM?
- remove()
- delete()
- erase()
- destroy()
Answer: remove()
The remove() method completely removes selected elements from the DOM.
18. Which method hides an element with a sliding animation?
- slideUp()
- fadeOut()
- hide()
- slideHide()
Answer: slideUp()
The slideUp() method hides elements using a sliding animation.
19. Which method displays an element with a sliding animation?
- slideDown()
- show()
- fadeIn()
- slideShow()
Answer: slideDown()
The slideDown() method displays hidden elements with a sliding effect.
20. Which jQuery feature allows data to be loaded from a server without refreshing the page?
- AJAX
- JSON
- XML
- DOM
Answer: AJAX
AJAX enables asynchronous communication with the server without reloading the webpage.