Single Choice Question

  1. What is the purpose of a form in HTML?
    1. To display images.
    2. To collect user input.
    3. To style web pages.
    4. To validate server-side scripts.
  2. What is the purpose of the "required" attribute in an input field?
    1. To make the field mandatory.
    2. To validate the input data.
    3. To style the form.
    4. To submit the form.
  3. What is the purpose of the "placeholder" attribute in an input field?
    1. To provide a default value for the field.
    2. To display a message when the field is empty.
    3. To style the form.
    4. To submit the form.
  4. Which attribute is used to specify the action to be performed when the form is submitted?
    1. action
    2. operation
    3. url
    4. method
  5. What attribute is used to define the action URL of an HTML form?
    1. type
    2. method
    3. action
    4. src
  6. Which input type is used to create a single-line text field?
    1. text
    2. password
    3. submit
    4. reset
  7. What is the default method of an HTML form if it is not specified?
    1. GET
    2. POST
    3. PUT
    4. DELETE
  8. How do you create a radio button group in HTML?
    1. Use the same name attribute for all radio buttons in the group. 创建一组单选按钮（radio buttons），必须为它们设置相同的 name 属性值，这样用户一次只能选择其中一个选项。
    2. Use the same id attribute for all radio buttons in the group.
    3. Wrap the radio buttons in a <div> element.
    4. Use the type="group" attribute for the first radio button.
  9. What attribute is used to define a placeholder text for an input field?
    1. placeholder
    2. value
    3. default
    4. text
  10. Which input type is used to create a checkbox?
    1. checkbox
    2. radio
    3. button
    4. image
  11. What is the purpose of the enctype attribute in an HTML form?
    1. To define the character encoding of the form data.
    2. To define the MIME type of the form data when submitting files. 提交表单数据的编码类型（MIME type）
    3. To define the color scheme of the form.
    4. To define the font size of the form.
  12. How do you create a submit button in an HTML form?
    1. Use <input type="submit">
    2. Use <button> without specifying a type.
    3. Use <button type="reset">
    4. Use <input type="text"> with a placeholder text.
  13. What is the purpose of the autocomplete attribute in an HTML form?
    1. To automatically fill in form fields based on user's previous entries. 浏览器是否自动填充用户之前输入过的数据，如用户名、邮箱、地址
    2. To validate form data on the client side.
    3. To submit form data to the server automatically.
    4. To encrypt form data before submission.
  14. Which input type is used to create a drop-down list?
    1. select
    2. dropdown
    3. list
    4. menu
  15. How do you create a multi-line text field (textarea) in HTML?
    1. Use <input type="textarea">
    2. Use <textarea> with opening and closing tags.
    3. Use <input type="multiline">
    4. Use <multiline> with opening and closing tags.
  16. What is the purpose of the required attribute in an HTML form input?
    1. To indicate that the input field is for read-only data.
    2. To make the input field mandatory for form submission.
    3. To automatically submit the form when the field is filled.
    4. To validate the input format based on a predefined pattern.
  17. How do you create a form element in HTML?
    1. Use <form> with opening and closing tags.
    2. Use <input type="form">
    3. Use <div class="form">
    4. Use <section> with a specific class for forms.
  18. What is the purpose of the novalidate attribute in an HTML form?
    1. To disable browser-side form validation. 禁用浏览器的默认表单验证
    2. To enable automatic form submission on page load.
    3. To encrypt form data before sending it to the server.
    4. To change the color of form fields when they are invalid.
  19. Which HTML element is used to group related form controls?
    1. <fieldset> 将相关的表单控件组合在一起
    2. <section>
    3. <div>
    4. <group>
  20. How do you define a label for an input field in HTML?
    1. Use <label> with the for attribute matching the input's id.
    2. Use <input> with a label attribute.
    3. Wrap the input inside a <label> element.
    4. Both A and C are correct.
  21. What attribute is used to specify the character encoding of form data?
    1. enctype
    2. charset
    3. accept-charset
    4. encoding
  22. How do you create a file input field in HTML?
    1. Use <input type="file">
    2. Use <input type="upload">
    3. Use <file> with opening and closing tags.
    4. Use <input type="text" accept="file/*">
  23. What is the purpose of the name attribute in an HTML form input?
    1. To define the value of the input field.
    2. To assign a unique identifier to the input field for server-side processing. name 属性用于为每个 < input> 元素指定一个字段名称，该名称会在表单提交时作为 键（key） 发送到服务器，与用户输入的值（value）一起形成键值对
    3. To change the color of the input field.
    4. To define the placeholder text for the input field.
  24. Which input type is used to create a button that resets the form to its initial values?
    1. reset
    2. clear
    3. erase
    4. initialize

True or False Question

  1. An HTML form can be submitted without a submit button.
    True
  2. The <input type="text"> element is used for multiple-line text inputs.
    False
  3. The <select> element allows the user to select one from a dropdown menu.
    True
  4. The <textarea> element defines a single-line text input control?
    False
  5. The <input type="password"> element displays the characters as asterisks for security.
    True
  6. The <input type="radio"> element allows the user to select only one of a limited number of choices.
    True
  7. The <input type="checkbox"> element allows the user to select multiple options from a list of checkboxes.
    True
  8. The <input type="submit"> element defines a submit button that submits the form data to a server.
    True
  9. The method attribute of an HTML form is used to specify the HTTP method used to submit the form data.
    True
  10. The post method is more secure than the get method.
    True POST 提交的数据不会暴露在 URL 中,GET 会把数据附加在 URL 后面
  11. The <input type="hidden"> element is used to define a hidden input field.
    True

Definition of Term

  1. Form HTML 中的 < form> 元素用于收集用户输入的数据，并将其提交到服务器进行处理。
  2. Input control 输入控件是 < form> 内用于接收用户输入的 HTML 元素，如文本框、密码框、单选按钮、复选框、下拉列表等。

Short Answer

  1. Try to explain the function of the form element.
    The < form> element in HTML is used to collect and submit user input to a server for processing. It acts as a container for various input elements such as text fields, checkboxes, radio buttons, and buttons. The form uses attributes like action (to specify where to send the data) and method (to define how to send the data, e.g., GET or POST).
  2. Explain types of button controls in HTML.
    < button type="submit"> – Submits the form data to the server.
    < button type="reset"> – Resets all fields in the form to their initial values.
    < button type="button"> – Does not submit or reset; often used with JavaScript for custom actions.
  3. Explain the difference between get and post method in form.
    POST: Attach the login data to the body of the HTTP request; There is no limitation for the length; Forms submitted through post cannot be bookmarked
    GET: Attach from data as name/value pairs; The length of the URL is limited for different browsers; Never use get to send sensitive data; It's useful for submitting forms that users want to bookmark;Get is more suitable for non-secure data.
  4. List and explain the most important attributes of an input control.(at least 5)
    • type: Specifies the type of input (e.g., text, password, email, etc.)
    • name: Identifies the input when submitted; used as the key in key-value pairs
    • value: Sets the initial value of the input
    • required: Makes the input field mandatory before form submission
    • readonly: Makes the field uneditable but still submitted
    • placeholder: Displays hint text inside the input field
  5. List and explain the most commonly used input type controls in a form.(at least 5)
    • text: Single-line plain text input
    • password: Hidden characters input for passwords
    • email: Input for email addresses, with built-in validation
    • radio: Single-choice selection (grouped by name)
    • checkbox: Allows multiple selections
    • submit: Button to submit the form
    • file: Allows users to upload files