01
True or false
1 point
True or false: In a web application, HTML provides structure and meaning, CSS controls appearance and layout, and JavaScript responds to user actions and updates the page.
Free Practice Quiz Question List
8 Building Interactive Web Applications Online Quiz Questions
Use this free practice quiz with 20 questions to review 8 Building Interactive Web Applications, test your knowledge, and prepare for your next test or exam.
20 questions
02
Choose one
1 point
You need a control that users can activate with the keyboard and that has built-in browser behavior. Which HTML element is the best starting point?
- A
A
<span>with text that looks like a button - B
A
<button>element - C
A
<div>with a click handler - D
A heading element with a background color
03
Fill in the blank
1 point
JavaScript uses to register a handler that responds when an event occurs.
04
Written response
1 point
In the task-list example, which DOM method finds an element that matches a CSS selector such as #task-form?
05
True or false
1 point
True or false: The required attribute alone prevents a form from being submitted when its text input contains only spaces.
- A
True
- B
False
06
Choose one
1 point
In the task-list example, what happens when a user submits an input containing only spaces?
- A
Treat it as a valid task because the original input was not empty
- B
Remove the task list and reset the page
- C
Show an instruction, focus the input, and stop before adding a task
- D
Submit the form to a server automatically
07
Fill in the blank
1 point
When a task is marked complete in the example, its item toggles the CSS class named .
08
Choose all
1 point
Select all accurate statements about validation in the task-list example and in an application that sends data to a server.
- A
The
requiredattribute prevents submission when the input is empty. - B
A JavaScript trimmed-value check can reject input that contains only spaces.
- C
Client-side validation means server-side validation is never needed.
- D
When data is sent to a server, client-side checks do not replace server-side validation.
09
Written response
1 point
What value does the example's feedback paragraph use for its role attribute?
10
Choose all
1 point
When testing an interactive web application for different users and devices, which areas should you check? Select all that apply.
- A
Keyboard navigation
- B
Visible focus
- C
Screen-reader announcements
- D
Behavior on narrow screens
- E
Mouse clicks as the only interaction test
11
Choose one
1 point
A form handler should add a task to the current page without letting the browser perform its normal submission behavior. Which action in the example enables this?
- A
It clears all tasks from the page.
- B
It validates the input on the server.
- C
It cancels the form's default action so the handler can update the page.
- D
It automatically reloads the page after adding a task.
12
Choose one
1 point
When adding a task, which approach displays user-entered text without treating it as HTML markup?
- A
Assign the user input as HTML so the browser can render any markup in it.
- B
Assign the user input with
textContent. - C
Convert the input into a CSS class.
- D
Place the input in a heading and rely on the heading to sanitize it.
13
Open ended
1 point
A task-list application behaves unexpectedly after a change. Describe a practical debugging and retesting process using browser developer tools.
14
True or false
1 point
True or false: The task-list example saves tasks to a server so they remain available after the current page session.
- A
True
- B
False
15
Choose one
1 point
You are structuring a page section that displays several peer tasks. Which approach best uses semantic HTML to represent the collection?
- A
Put each task in a separate heading.
- B
Group the tasks in an unordered list, with one list item per task.
- C
Put each task in a separate form.
- D
Place all tasks in one paragraph.
16
Choose one
1 point
A form is laid out as a flex row. Its input has flex: 1 and min-width: 0. What layout behavior should you expect from the input?
- A
The input stays at its minimum content width.
- B
The input is removed from the form's layout.
- C
The input expands to use available space in the row.
- D
The input is aligned at the bottom of the form.
17
Choose one
1 point
A task row uses flex layout with align-items: center and justify-content: space-between. How will its child elements be arranged?
- A
The children are vertically centered and spread across the row.
- B
The children are stacked vertically and centered horizontally.
- C
The children are placed together at the start of the row.
- D
The children are spread across the row and aligned to its top edge.
18
Choose one
1 point
A page body has a max-width and uses margin: 2rem auto. Which result does this combination support?
- A
The body always fills the entire viewport and aligns to the left.
- B
The body has a fixed width and overflows narrower screens.
- C
The body is centered vertically but remains flush with one horizontal edge.
- D
The body is centered horizontally when space permits and does not grow beyond its maximum width.
19
Written response
1 point
A form's controls are arranged in a flex row. Which CSS property can add consistent space between adjacent controls without setting margins on each one?
20
Written response
1 point
You want to adjust the spacing between lines of text throughout a page using a body style. Which CSS property should you change?