全部学科
NodeJS全栈
nodejs
Python全栈
python
小程序首页

表单进阶与验证专题测试

20 题 45 分钟 难度:

考察知识点

  • 原生表单验证:required/pattern/min/max/step属性、约束验证API
  • 表单提交与编码:enctype编码类型、method提交方法、target目标窗口
  • 表单高级控件:datalist数据列表、output输出元素、fieldset/legend分组
  • 表单无障碍:label关联、aria属性、表单可访问性
1
单选题

以下关于 HTML5 required 属性的说法,正确的是?

A

required 属性可以用于所有表单元素

B

required 属性只适用于 input 元素

C

设置 required 后,用户必须填写才能提交表单

D

required 属性需要配合 JavaScript 才能生效

2
单选题

HTML form 元素的 method 属性默认值是?

A

POST

B

GET

C

PUT

D

DELETE

3
单选题

设置 <form target="_blank"> 后,表单提交后会发生什么?

A

表单在当前页面提交,刷新当前页面

B

表单在新窗口/标签页中提交,响应显示在新页面

C

表单在父级窗口中提交

D

表单不提交,target 属性无效

4
单选题

以下关于 form 元素的 action 属性,说法正确的是?

A

action 属性是必需的,省略会导致表单不提交

B

省略 action 时,表单提交到当前页面 URL

C

action 只能是相对路径

D

action 不能包含查询字符串

5
单选题

HTML5 的 <datalist> 元素的作用是?

A

创建下拉选择框,替代 select 元素

B

为 input 元素提供预定义的选项建议列表

C

创建多级下拉菜单

D

验证 input 输入是否在选项范围内

6
单选题

使用 <input type="email"> 时,以下哪个输入值会通过浏览器验证?

A

test

B

test@

C

test@example

D

test@example.com

7
单选题

以下代码中,如何让"同意条款"复选框成为必选项?

HTML
<form>
  <label>
    <input type="checkbox" name="agree">
    同意用户条款
  </label>
  <button type="submit">注册</button>
</form>
A

<input type="checkbox" name="agree" required>

B

<input type="checkbox" name="agree" min="1">

C

<input type="checkbox" name="agree" checked required>

D

checkbox 不支持 required,需要用 JavaScript 验证

8
单选题

使用默认编码类型提交表单,输入内容为 "A & B = C",服务器接收到的数据是什么?

HTML
<form action="/submit" method="POST">
  <input name="content" value="A & B = C">
</form>
A

content=A & B = C

B

content=A%20%26%20B%20%3D%20C

C

content=A+%26+B+%3D+C

D

content=A%26B%3DC

9
判断题

HTML5 的 pattern 属性值需要用斜杠包裹正则表达式,如 pattern="/^[a-z]+$/"

A

B

10
判断题

使用 method="GET" 提交包含密码的表单是安全的,因为数据会被编码。

A

B

11
判断题

enctype="text/plain" 是表单提交的推荐编码类型,适用于大多数表单。

A

B

12
判断题

设置 <fieldset disabled> 后,其内部的所有表单控件都会被禁用,无法接收用户输入。

A

B

13
判断题

<input type="date"> 的值格式为 "YYYY-MM-DD",例如 "2024-03-15"。

A

B

14
填空题

完成以下代码,创建一个必须填写且格式为6位数字的验证码输入框:

HTML
<input type="text"
       !!1_required!!
       !!2_pattern="[0-9]{6}"!!
       title="请输入6位数字验证码"
       placeholder="验证码">
15
填空题

完成以下代码,创建一个可上传图片的表单:

HTML
<form action="/upload"
      !!1_method="POST"!!
      !!2_enctype="multipart/form-data"!!>
  <input type="file" name="image" accept="image/*">
  <button type="submit">上传</button>
</form>
16
填空题

完成以下代码,创建一个带有标题的用户信息分组:

HTML
<________>
  <______>用户基本信息</______>
  <input name="username" placeholder="用户名">
  <input name="email" placeholder="邮箱">
</________>
17
多选题

关于 HTML5 的 step 属性,以下说法正确的有?

A

step 属性可以用于 type="number" 的 input 元素

B

step="0.01" 可以让用户输入两位小数

C

step 默认值为 1,适用于大多数数字类型

D

step 属性也可以用于 type="time" 的 input 元素

18
多选题

关于 HTML form 的 enctype 属性,以下说法正确的有?

A

enctype 默认值是 application/x-www-form-urlencoded

B

enctype="multipart/form-data" 用于上传文件

C

enctype="text/plain" 会保留空格但不编码特殊字符

D

上传文件时必须使用 enctype="multipart/form-data"

19
多选题

关于 HTML5 的 <output> 元素,以下说法正确的有?

A

output 元素用于显示计算结果或用户操作的结果

B

output 元素的值可以通过 for 属性关联表单控件

C

output 元素是表单控件,用户可以编辑其内容

D

output 元素可以通过 JavaScript 动态更新值

20
多选题

以下关于 HTML5 新增 input 类型的说法,正确的有?

A

type="url" 会验证输入是否为有效的 URL 格式

B

type="tel" 会验证输入是否为有效的电话号码格式

C

type="number" 会验证输入是否为数字

D

type="date" 会提供日期选择器界面

← 上一个试卷 多媒体与嵌入内容专题测试

📝 发现内容有误?点击此处直接编辑

想参加完整模拟考试?
小程序提供计时考试、自动评分和详细解析

长按或扫描二维码,立即体验

扫码体验小程序
马上就来
使用微信扫描二维码
立即体验完整题库