表单专题面试题第 1 页，显示第 1–50 题，共找到 157 道完整解析，可继续按分类、标签与关键词缩小范围。
按稳定语义路径排序
面对一个登录表单，Playwright 的 getByLabel、getByPlaceholder、getByText 之间应如何按优先级选择？ 本文先给出可直接复述的结论，再用最小代码说明Playwright getByLabel getByPlaceholder getByText 选择的工作方式、判断依据、项目边界和常见误区。
页面上没有可见 file input（只有拖拽区或按钮）时，Playwright 如何用 filechooser 事件完成上传？ 本文先给出可直接复述的结论，再用最小代码说明Playwright filechooser 无 input 元素文件上传的工作方式、判断依据、项目边界和常见误区。
只用键盘事件（Tab、Enter、快捷键）驱动表单流程时，Agent 需要验证什么才能确认焦点轨迹正确？ 本文先给出可直接复述的结论，再用最小代码说明Playwright 键盘 Tab 焦点轨迹验证的工作方式、判断依据、项目边界和常见误区。
原生 select 用 selectOption，而自绘下拉框必须点开再选项——Agent 如何区分并分别自动化？ 本文先给出可直接复述的结论，再用最小代码说明Playwright selectOption 与自绘下拉框自动化的工作方式、判断依据、项目边界和常见误区。
从工作区、模型生成与用户补充信息三个方向解释 MCP 客户端能力，说明 sampling.tools 和 elicitation 模式，以及能力声明不等于授权或资源开放。
MCP 的 Elicitation 允许服务端向用户请求结构化输入，适用场景与敏感信息限制是什么？ 本文先给出可直接复述的结论，再用最小代码说明MCP elicitation 用户输入 请求的工作方式、判断依据、项目边界和常见误区。
如何在模型驱动表单中动态添加或删除表单控件？这需要修改哪些数据结构？ 本文先给出可直接复述的结论，再用最小代码说明模型驱动表单 动态添加删除控件的工作方式、判断依据、项目边界和常见误区。
当一个组件的 @Input() 属性接收了空值（如 null）时，它是否会被视为有效输入？如何判断是否已赋值？ 本文先给出可直接复述的结论，再用最小代码说明Angular @Input() null 值 有效输入 判断方式的工作方式、判断依据、项目边界和常见误区。
父组件如何通过 @Input() 和 @Output() 与子组件通信？当子组件发出事件后，父组件如何处理？ 本文先给出可直接复述的结论，再用最小代码说明Angular @Input @Output 通信 事件发射 事件处理的工作方式、判断依据、项目边界和常见误区。
<input type=file> 的 accept 属性能否当作安全校验，失败体验应怎样兜底？ 本文先给出可直接复述的结论，再用最小代码说明input file accept 属性 校验的工作方式、判断依据、项目边界和常见误区。
:focus-within 在元素本身或任意后代拥有焦点时匹配，适合高亮整个表单字段组或展开包含输入框的面板。它不会把焦点移到父元素；与 :focus 相比，触发范围更大，组件嵌套时需要注意样式向上联动。
:required 匹配带 required 属性的表单控件，:optional 匹配不要求必填的控件，两者描述属性状态而不是用户当前输入是否有效。禁用控件也可能匹配必填规则；表单错误样式要把必填状态与 :invalid 等校验状态分开处理。
:in-range 和 :out-of-range 只对支持范围约束的输入类型有意义，按 min、max 与当前值决定匹配结果。它们描述是否越界，不等于整个控件的 :valid 或 :invalid 状态；必填、格式错误等其他约束仍要另行判断。
:enabled 和 :disabled 只能选中可禁用的表单控件，对链接无效。这里说明哪些元素能被禁用、fieldset 禁用后对后代控件的影响，以及为什么仅写 disabled 属性未必能代表实际状态。
表单校验规则随业务频繁增减时，如何用策略模式组织校验逻辑？ 本文先给出可直接复述的结论，再用最小代码说明策略模式 表单校验 规则的工作方式、判断依据、项目边界和常见误区。
focusin/focusout 事件与 focus/blur 事件在冒泡行为上有何差异？在表单校验中如何选择？ 本文先给出可直接复述的结论，再用最小代码说明focusin focusout 与 focus blur 区别的工作方式、判断依据、项目边界和常见误区。
HTMLCollection 的 namedItem 方法在什么时候有用？它如何处理重名的项？ 本文先给出可直接复述的结论，再用最小代码说明HTMLCollection namedItem 重名处理的工作方式、判断依据、项目边界和常见误区。
在 Express 接口设计中，multipart/form-data 直传与 JSON 内嵌 base64 各有什么代价？ 本文先给出可直接复述的结论，再用最小代码说明Express 文件上传 multipart base64 对比的工作方式、判断依据、项目边界和常见误区。
Go 的 select 在多个 case 同时就绪时怎么选择，default 分支带来什么行为变化？ 本文先给出可直接复述的结论，再用最小代码说明Go select 随机 就绪 default 非阻塞的工作方式、判断依据、项目边界和常见误区。
为什么 GraphQL 的输入参数必须使用 Input 类型而不能直接用 Object 类型？ 本文先给出可直接复述的结论，再用最小代码说明GraphQL input type 输入类型 原因的工作方式、判断依据、项目边界和常见误区。
<form> 的 accept-charset 指定提交表单时用于编码表单数据的字符编码。现代 HTML 中实际应使用 UTF-8；省略时，浏览器通常按文档的字符编码处理表单提交。
HTML 的 value 内容属性给输入框初始值，DOM 的 input.value 属性表示当前可编辑值。用户输入后，input.value 会更新，而 getAttribute("value") 通常仍是标记上的初始值。
autocomplete 用来提示浏览器和密码管理器字段的用途。登录页现有密码使用 current-password，注册或重设密码使用 new-password，用户名可用 username。
autocomplete 不只是 on 或 off；shipping street-address、cc-number 等 token 会告诉浏览器字段用途和所属分组。填写收货地址与账单地址时，分组前缀能避免值被填错位置；token 顺序和字段名写错也会让自动填充失效。
页面或对话框出现时，autofocus 会让浏览器自动聚焦指定控件，但焦点位置与滚动位置可能因此变化。同一文档里多个候选只会有一个最终焦点；动态对话框打开时，还得考虑滚动位置和键盘、读屏用户是否被突然打断。
在 form 中，button 没写 type 时默认是 submit，点击取消或展开详情按钮也可能触发表单提交。submit、button、reset 的行为不同，非提交按钮要显式标类型；回车提交也不能靠拦截每个点击事件修补。
全选框常见的横杠状态由 DOM 属性 indeterminate 控制，它只是视觉上的混合态，不会替换 checked 布尔值，也不会作为单独值提交。结合三项列表说明如何根据子项重算状态，并提醒刷新或重新渲染后需要再次设置。
颜色输入过去常被认为只接受不透明的 #rrggbb，但当前规范和部分浏览器已支持更多 CSS 颜色语法，并提供 alpha 与 colorspace 属性。还要区分现代能力与兼容性回退，说明颜色选择器 UI 和提交值都需要按目标浏览器验证。
required 输入框在页面刚打开时就可能匹配 :invalid，立即标红会给用户造成“还没填就报错”的体验。:user-valid 与 :user-invalid 更适合在用户交互后显示状态；数值范围控件还可结合 :in-range、:out-of-range 分辨边界错误。
datalist 通过 input 的 list 属性提供候选建议，输入框仍接受列表外的自由文本，不具备 select 的强制枚举约束。候选标签、实际输入值与表单提交值可能不完全相同；若业务只允许已知选项，还需选择受控控件或在服务端校验。
原生 date 控件可能按用户地区显示日期，但它的 value 与表单提交值是 YYYY-MM-DD 形式的日历日期，不含时区和一天内的具体时刻。直接把日期字符串交给 new Date 再按本地时区显示，可能偏移一天；生日与预约时刻需要不同的数据模型。
datetime-local 让用户输入本地墙上时间，value 形如 YYYY-MM-DDTHH:mm，却不附带 UTC 偏移或时区名称。它与拆开的日期、时间字段各有取舍；跨地区预约还必须确定时区，并处理夏令时带来的歧义。
type=email 会做基础地址语法校验，并可配合 required、multiple 与 pattern；它不会验证邮箱真实存在或用户拥有收件权。加号别名和子域名不应被随意拒绝；国际化邮箱有兼容边界，确认所有权仍要发送验证邮件。
比较普通字段、文件分段和纯文本三种表单编码。文件上传常用 multipart/form-data 传递文件内容与字段边界；浏览器会生成 boundary。用 FormData 加 fetch 时不要手写不完整的 Content-Type，也要分清原生提交和脚本请求。
给 fieldset 加 disabled 可以批量禁用后代表单控件，禁用控件不能获得焦点，也不进入正常提交数据。但第一个 legend 内的后代控件是例外。首个组名里的开关可以让用户启用整组；禁用与只读在聚焦、校验、提交上的行为并不相同。
一组相关单选按钮若只靠视觉边框，读屏用户很难知道它们共同回答什么问题。fieldset 建立分组，首个 legend 提供组标题；组标题与各选项的 label 各有分工；占位文本不能代替说明，嵌套分组也要保持清楚。
file 输入的 accept 提示文件选择器显示哪些类型，multiple 允许一次选择多个文件；它们都不是服务器安全边界。扩展名、MIME 类型和通配符只影响选择提示；拖拽或伪造请求仍需由后端检查文件内容、大小和数量。
表单相关控件可用 form 属性指向同一文档中表单的 id，即使 DOM 上不在 form 内也能参与该表单的提交与校验。通过页面底部固定提交栏说明这种用法，强调关联不会自动传给后代控件，且 name、disabled 等规则仍然适用。
FormData(form) 按表单成功控件规则构造名称和值数据，包含已关联的表单外控件和已选文件，却跳过禁用字段与通常没有 name 的控件。复选框、多个同名字段、文件与提交按钮各有收集规则；要包含某个按钮的值还需指定提交者。
同一张表单可以有“保存草稿”和“正式发布”两条提交路径。提交按钮的 formmethod、formaction 会覆盖所属表单的 method、action，只对通过该按钮发起的提交生效。按钮只有作为本次提交者时覆盖设置才生效，服务端还要根据提交者区分草稿与发布操作。
提交按钮的 formnovalidate 能让这一次表单提交跳过浏览器的交互式约束校验，常用于内容未写完也要保存草稿。它不删除 required、pattern 等规则，更不会关闭服务端校验。对比正式发布按钮，可以看清何时适合跳过前端阻断。
type=hidden 的输入不显示也不能由用户直接编辑，但具名且启用时仍会随表单提交。它适合携带记录标识、页面上下文或表单状态，却不是保密或防篡改机制。服务器仍须根据登录身份核对权限；隐藏字段会提交，真正禁用的控件则不会。
input type=image 是以图片呈现的提交按钮，点击时除触发表单提交，还会发送相对图片的点击坐标。无 name 时提交 x、y，具名时变成 name.x、name.y；alt 要说明操作，图片失败时也应可用。
lang 表示字段期望的语言，dir 表示文字的基础书写方向，它们能帮助浏览器和辅助技术理解输入内容，却不能可靠锁定中文或英文输入法，也不会自动改变表单编码。还要区分输入语言、文字方向、虚拟键盘提示与提交方向信息。
显式关联通过 label 的 for 匹配控件 id，隐式关联可把控件嵌套在 label 内；两种方式都能为输入提供可访问名称并扩大点击区域。显式写法要求 for 对应文档里唯一的 id；嵌套控件时通常无需再写 for，一个标签也不应含糊地指向多个输入。
文本输入和 textarea 都可用 minlength、maxlength 约束文本长度，长度按 UTF-16 代码单元而非用户眼中的字数计算。minlength 不等于必填，脚本赋值和用户输入的校验时机不同；浏览器限制编辑也不能代替后端再次检查。
type=month 选择的是年和月，value 采用 YYYY-MM 字符串，不包含具体日期、时刻和时区。min、max 使用同样格式限制范围，step 可按月份递增；还要注意该控件并非所有主流浏览器都有一致的原生选择器，生产环境需测试回退。
number 控件默认步长为 1，合法值以 min、初始 value 或 0 为基准按整步递增。step=0.1 只允许落在该间隔上的值，step=any 则取消步长不匹配约束，但仍受数值格式及 min、max 影响。用 0.2、0.3 等值手算一次，就能看清步长基准怎样改变合法序列。
数字框的原生校验并不只有一个“输入错误”。还能把低于下限、高于上限和不符合步进分别对应到 rangeUnderflow、rangeOverflow、stepMismatch，并说明提交时何时显示提示、怎样读 validity 与处理空值。
下拉框中的选项组可以用 disabled 暂时关闭整组候选。组内选项不能由用户正常选择，但已有选择、脚本赋值与服务端权限校验仍需要单独处理。 它适合展示暂不可用的套餐，但不能作为业务权限控制；如果原本已选中某项，还要检查实际提交行为。
