JavaScript, AJAX, and jQuery:

JavaScript - AJAX & jQuery

AJAX (Asynchronous JavaScript and XML)

Q1: What does AJAX stand for?
A) Asynchronous JavaScript and XML
B) Asynchronous JSON and XML
C) Asynchronous JavaScript and XHTML
D) All of the above
Answer: A) Asynchronous JavaScript and XML
Explanation: AJAX stands for Asynchronous JavaScript and XML, a technique for making
asynchronous requests in web applications.

Q2: Which of the following methods is used to make an AJAX request in JavaScript?
A) XMLHttpRequest()
B) ajaxRequest()
C) fetch()
D) Both A and C
Answer: D) Both A and C
Explanation: Both XMLHttpRequest() and fetch() methods can be used to make AJAX
requests in JavaScript.

Q3: Which of the following is a key benefit of using AJAX in web development?
A) Faster page loading
B) Reduces server-side processing
C) Allows partial page updates
D) All of the above
Answer: D) All of the above
Explanation: AJAX allows web pages to be updated dynamically, reducing server requests,
allowing partial page updates, and improving user experience.

Q4: In which method can you check the status of an AJAX request?
A) statusCode()
B) responseText()
C) readyState
D) status
Answer: D) status
Explanation: The status property of the XMLHttpRequest object returns the HTTP status
code of the request.

Q5: What is the purpose of the async attribute in an AJAX request?

A) To make the request asynchronous
B) To synchronize multiple requests
C) To allow data to be processed on the client-side
D) To specify the data format
Answer: A) To make the request asynchronous
Explanation: The async attribute specifies that the request should be asynchronous, meaning
the browser can continue processing other tasks while the request is being handled.

Q6: Which of the following is NOT a valid HTTP request method in AJAX?
A) GET
B) POST
C) PUT
D) CONNECT
Answer: D) CONNECT
Explanation: The CONNECT method is not typically used in AJAX. Common methods include
GET, POST, and PUT.

Q7: What is the role of the onreadystatechange event in AJAX?

A) To monitor the response time of the server
B) To monitor changes in the request state
C) To validate the response data
D) To update the page automatically
Answer: B) To monitor changes in the request state
Explanation: The onreadystatechange event is triggered when the readyState property of the
XMLHttpRequest object changes, indicating a change in the request's status.

Q8: Which of the following is the correct syntax to create an XMLHttpRequest object?
A) var xhr = new XMLHttpRequest()
B) var xhr = new AjaxRequest()
C) var xhr = new XMLHttpRequest()
D) var xhr = new XMLHttp()
Answer: A) var xhr = new XMLHttpRequest()
Explanation: The correct syntax to create an XMLHttpRequest object is new
XMLHttpRequest().

Q9: Which method in AJAX is used to send the request to the server?
A) sendRequest()
B) send()
C) post()
D) request()
Answer: B) send()
Explanation: The send() method is used to send the request to the server in AJAX.

Q10: What is the default value of the readyState property in AJAX?

A) 0
B) 1
C) 2
D) 3
Answer: A) 0
Explanation: The default value of the readyState property is 0, which means the request is
not yet initialized.

jQuery

Q11: What does jQuery allow you to do?

A) Select and manipulate HTML elements
B) Perform animations
C) Handle events
D) All of the above
Answer: D) All of the above
Explanation: jQuery is a fast and lightweight JavaScript library that simplifies DOM
manipulation, event handling, animations, and AJAX interactions.

Q12: How do you select an element with an id of "test" in jQuery?

A) $("#test")
B) $(".test")
C) $("test")
D) getElementById("test")
Answer: A) $("#test")
Explanation: In jQuery, the # symbol is used to select elements by their id. Therefore,
$("#test") selects an element with id="test".

Q13: Which of the following is used to add a click event listener in jQuery?
A) onClick()
B) addEventListener()
C) click()
D) addClickListener()
Answer: C) click()
Explanation: The click() method in jQuery is used to attach an event listener for a click event
to an element.

Q14: How do you hide an element using jQuery?

A) $(element).hide()
B) $(element).visible(false)
C) $(element).display('none')
D) $(element).hidden()
Answer: A) $(element).hide()
Explanation: The hide() method in jQuery is used to hide an element by setting its CSS display
property to none.
Q15: Which jQuery method is used to change the content of an HTML element?
A) change()
B) setText()
C) html()
D) setContent()
Answer: C) html()
Explanation: The html() method in jQuery is used to get or set the HTML content of an
element.

Q16: How can you load content from a server and place it in an HTML element using jQuery?
A) $.load()
B) $.ajax()
C) $.get()
D) $.getJSON()
Answer: A) $.load()
Explanation: The $.load() method in jQuery is used to load content from a server and insert it
into an HTML element.

Q17: What does the jQuery animate() method do?

A) Changes the content of an element
B) Adds animation effects to elements
C) Hides an element
D) Displays an element
Answer: B) Adds animation effects to elements
Explanation: The animate() method in jQuery is used to apply animation effects to selected
elements.

Q18: Which jQuery method can be used to remove an HTML element from the DOM?
A) remove()
B) delete()
C) destroy()
D) clear()
Answer: A) remove()
Explanation: The remove() method in jQuery is used to remove an element from the DOM.

Q19: How do you change the CSS property of an element in jQuery?

A) $(element).css("property", "value")
B) $(element).style("property", "value")
C) $(element).setStyle("property", "value")
D) $(element).setCss("property", "value")
Answer: A) $(element).css("property", "value")
Explanation: The css() method in jQuery is used to get or set the CSS properties of an
element.
Q20: What does the $(document).ready() function in jQuery do?
A) It runs as soon as the document is fully loaded and ready to be manipulated
B) It runs immediately after the document is parsed
C) It waits for all images to load before running the script
D) It runs only after the user clicks on the document
Answer: A) It runs as soon as the document is fully loaded and ready to be manipulated
Explanation: The $(document).ready() function in jQuery ensures that the code inside it is
executed only after the document is fully loaded and ready to be manipulated.

JavaScript - Advanced Concepts

Q21: What is the purpose of the [Link]() method in JavaScript?

A) Parse a JSON string into a JavaScript object
B) Convert a JavaScript object into a JSON string
C) Validate a JSON string
D) None of the above
Answer: B) Convert a JavaScript object into a JSON string
Explanation: [Link]() converts a JavaScript object into a JSON string, making it
suitable for storage or transmission.

Q22: Which of the following is TRUE about Promises in JavaScript?

A) A Promise can be in one of three states: pending, resolved, or rejected
B) Promises are used to perform synchronous operations
C) Promises replace the need for callbacks
D) Both A and C
Answer: D) Both A and C
Explanation: Promises provide a way to handle asynchronous operations, replacing the need
for callbacks and having states like pending, resolved, or rejected.

Q23: Which method in JavaScript is used to handle errors in promises?

A) catch()
B) then()
C) finally()
D) error()
Answer: A) catch()
Explanation: The catch() method is used to handle errors that occur during the execution of
promises.

Q24: What is the role of the defer attribute in a <script> tag?

A) It executes the script immediately
B) It defers the execution of the script until the document is fully parsed
C) It prevents the script from being loaded
D) It ensures the script is executed asynchronously
Answer: B) It defers the execution of the script until the document is fully parsed
Explanation: The defer attribute delays the execution of the script until the HTML parsing is
complete.

AJAX
Q25: Which AJAX method is used to fetch JSON data from a server?
A) $.getJSON()
B) $.ajax()
C) $.get()
D) All of the above
Answer: D) All of the above
Explanation: $.getJSON(), $.ajax(), and $.get() can fetch JSON data, though $.getJSON() is
specifically designed for this purpose.

Q26: Which HTTP status code indicates a successful request in AJAX?

A) 200
B) 201
C) 400
D) 500
Answer: A) 200
Explanation: A 200 status code indicates a successful HTTP request.

Q27: How can you set a custom header in an AJAX request?

A) Using setHeader() method
B) Using setRequestHeader() method
C) By specifying the header in the request body
D) By modifying the response object
Answer: B) Using setRequestHeader() method
Explanation: The setRequestHeader() method is used to set custom headers in an AJAX
request.

jQuery Advanced

Q28: What does the jQuery fadeIn() method do?

A) It fades out the visibility of an element
B) It increases the opacity of an element to make it visible
C) It removes the element from the DOM
D) It gradually resizes the element
Answer: B) It increases the opacity of an element to make it visible
Explanation: The fadeIn() method gradually changes the opacity of an element to make it
visible.

Q29: How do you chain multiple jQuery methods together?

A) Separate them with semicolons
B) Use a single period between methods
C) Use commas between methods
D) Use the andThen() function
Answer: B) Use a single period between methods
Explanation: jQuery supports method chaining, allowing multiple methods to be called
sequentially on the same element using a single period.

Q30: What is the difference between hide() and fadeOut() in jQuery?

A) hide() removes the element, fadeOut() hides it with opacity change
B) hide() hides instantly, fadeOut() adds a fading effect
C) Both perform the same function
D) fadeOut() is faster than hide()
Answer: B) hide() hides instantly, fadeOut() adds a fading effect
Explanation: The hide() method instantly hides the element, while fadeOut() gradually
decreases the opacity to zero.

Q31: Which method is used in jQuery to attach a hover event to an element?

A) hover()
B) mouseenter()
C) mouseleave()
D) All of the above
Answer: D) All of the above
Explanation: hover() can attach both mouseenter and mouseleave events, while the other
two are for individual events.

Q32: What does the ajaxStart() event do in jQuery?

A) It is triggered when an AJAX request starts
B) It executes when all AJAX requests are completed
C) It executes when the AJAX request fails
D) It is used to initialize an AJAX request
Answer: A) It is triggered when an AJAX request starts
Explanation: The ajaxStart() event is triggered whenever an AJAX request starts.

Q33: How do you stop an animation in progress in jQuery?

A) $(selector).stop()
B) $(selector).pause()
C) $(selector).cancel()
D) $(selector).terminate()
Answer: A) $(selector).stop()
Explanation: The stop() method stops the current animation on the selected element.

AJAX
Q34: In AJAX, which object is used to exchange data with a web server?
A) XMLHttpRequest
B) Fetch API
C) JSON
D) Both A and B
Answer: D) Both A and B
Explanation: AJAX uses XMLHttpRequest or the Fetch API to exchange data with a server
asynchronously.

Q35: What is the default method used by AJAX requests if not specified?
A) POST
B) GET
C) PUT
D) DELETE
Answer: B) GET
Explanation: The default HTTP method used by AJAX is GET unless specified otherwise.

Q36: How do you check the status of an AJAX request in JavaScript?

A) By checking responseText
B) By checking readyState and status
C) By checking onerror
D) By checking the URL
Answer: B) By checking readyState and status
Explanation: The readyState property represents the request's state, and the status property
indicates the HTTP status code.

Q37: Which property is used to get the response data of an AJAX request?
A) responseText
B) response
C) responseData
D) responseBody
Answer: A) responseText
Explanation: The responseText property contains the response data as a string.

jQuery AJAX
Q38: How do you send data in JSON format using jQuery's $.ajax() method?
A) Set the contentType to "application/json"
B) Convert the data object to JSON using [Link]()
C) Include both A and B
D) Only A
Answer: C) Include both A and B
Explanation: To send data in JSON format, you need to specify the contentType and convert
the data to JSON format using [Link]().
Q39: Which jQuery function allows you to load data from a server and place it in a specific
element?
A) load()
B) fetch()
C) post()
D) get()
Answer: A) load()
Explanation: The load() function loads data from the server and places it into the matched
element.

Q40: What does the $.ajaxSetup() method do in jQuery?

A) Defines default settings for AJAX requests
B) Disables AJAX requests
C) Configures AJAX caching
D) Executes after every AJAX request
Answer: A) Defines default settings for AJAX requests
Explanation: $.ajaxSetup() sets default settings for all AJAX requests.

jQuery Advanced Concepts

Q41: Which method in jQuery retrieves a specific attribute value of an element?

A) attr()
B) getAttribute()
C) prop()
D) css()
Answer: A) attr()
Explanation: The attr() method retrieves the value of the specified attribute of an element.

Q42: How do you apply a style dynamically to multiple elements in jQuery?

A) Use css() with a selector targeting multiple elements
B) Use addClass()
C) Both A and B
D) None of the above
Answer: C) Both A and B
Explanation: Styles can be applied dynamically using css() for inline styles or addClass() to
apply predefined CSS classes.

Q43: What is the difference between bind() and on() in jQuery?

A) bind() attaches events to future elements, while on() does not
B) on() is more flexible and supports event delegation
C) bind() is deprecated, but on() is not
D) Both B and C
Answer: D) Both B and C
Explanation: on() is a more flexible method that supports event delegation, whereas bind() is
deprecated.

Q44: What does the delegate() method do in jQuery?

A) Attaches events to the child elements dynamically
B) Replaces the parent element
C) Prevents event bubbling
D) Selectively applies CSS styles
Answer: A) Attaches events to the child elements dynamically
Explanation: delegate() allows you to attach an event to child elements even if they are
added dynamically.

Q45: How do you remove an element from the DOM using jQuery?
A) remove()
B) detach()
C) Both A and B
D) delete()
Answer: C) Both A and B
Explanation: remove() removes the element and its associated data, while detach() removes
the element but keeps its data intact.