# 1. ::part 与 CSS Variables 在 Shadow DOM 外部样式穿透的工程价值 A CSS 变量不会穿透 Shadow 边界 B ::part 会破坏组件内部结构 C CSS 变量适合单部件覆盖，::part 适合全局主题 D ::part 用于精确选择内部命名部件 ✓ 正确答案
# 2. Shadow DOM 的闭合性（:host/::slotted/::part） A ::slotted 用于选择内部未投射的节点 B ::part 用于选择插槽内容 C :host 在影子内部选择宿主元素 ✓ 正确答案 D 三者都允许外部无限制穿透内部
# 3. Shadow DOM 中的 :host 与 :host-context 的样式继承与重写 A :host-context 依据外部祖先元素选择宿主 ✓ 正确答案 B :host 只能设置 display，不能设置颜色 C 内部 :host 样式优先级永远高于外部 D :host-context 依据内部子元素选择
# 4. Slot 插槽（<slot name="...">）与 Web Components 组合 A 插槽内容会被移动到影子树中 B 插槽内容归属影子树 C 一个组件只能有一个插槽 D 未匹配具名插槽的子元素进入默认插槽 ✓ 正确答案
# 5. form-associated custom elements，formAssociated 标志与 ElementInternals（setFormValue、setValidity）如何让 Shadow DOM 自定义控件参与原生表单提交与校验？ A setValidity 无法与原生校验流程协作 B setFormValue 只影响显示不影响提交 C formAssociated 标志让元素参与表单提交与校验 ✓ 正确答案 D 无需 attachInternals 即可关联表单
# 6. Shadow DOM 的事件重定向与 composedPath A 事件重定向使外部 target 变为宿主元素 ✓ 正确答案 B composedPath 不包含内部节点 C 非 composed 事件也能跨边界冒泡 D 事件重定向使 target 始终为内部节点
# 7. Scoped Element Registries 提案（多版本同名自定义元素共存）在微前端与组件库升级中的工程价值 A 它让自定义元素注册表保持全局唯一 B 它允许影子根内注册同名不同版本元素 ✓ 正确答案 C 它只适用于传统单页应用 D 它无法解决微前端组件冲突
# 8. Shadow DOM 的开放（open）与封闭（closed） A closed 模式 shadowRoot 对外可访问 B open 模式 shadowRoot 对外可访问 ✓ 正确答案 C closed 模式保证绝对安全 D open 模式无法被外部调试
# 9. Declarative Shadow DOM 与流式 SSR/hydration 的配合，服务端渲染自定义元素的工程实现 A 它需要客户端 JS 才能创建影子根 B 它无法被搜索引擎索引 C 它通过 <template shadowrootmode> 声明影子 DOM ✓ 正确答案 D 它只适用于客户端渲染
# 10. Shadow DOM 的 :host(:hover) 与 :host-context() 在组件状态的应用 A :host(:hover) 匹配影子内部元素悬停 B :host-context() 匹配内部子元素 C :host-context() 依据外部祖先匹配宿主 ✓ 正确答案 D :host(:hover) 无法响应宿主悬停
# 11. Shadow DOM 的 <slot> fallback 内容与 named slot 的工程取舍 A 具名插槽通过 name 匹配对应 slot 属性 ✓ 正确答案 B fallback 内容在有内容投射时仍显示 C fallback 用于强制注入内容 D 一个作用域只能有一个插槽
# 12. Shadow DOM 的 getRootNode() 与 composedPath() 在事件溯源的工程实践 A composedPath 返回事件完整路径（含 shadow 内部节点） ✓ 正确答案 B getRootNode 永远返回 document C composedPath 不包含内部节点 D getRootNode 无法返回 shadowRoot
# 13. Shadow DOM 的 Adopted Stylesheets（adoptedStyleSheets）在多实例样式复用的现代应用 A 一张样式表只能被一个 shadowRoot 使用 B adoptedStyleSheets 替代了所有 DOM 渲染 C 多实例可共享同一份 CSSStyleSheet ✓ 正确答案 D 它只能应用于 document，不能用于 shadowRoot
# 14. 可继承 CSS 属性穿过 Shadow 边界的规则，哪些属性（color、font、line-height）默认继承，:host 的 reset 与外部样式的协作边界？ A margin 会穿过 Shadow 边界继承 B 所有属性都穿透边界 C :host 无法控制继承 D color、font 等可继承属性会穿透边界 ✓ 正确答案
# 15. Shadow DOM（attachShadow、mode: open/closed）的样式与结构封装 A attachShadow 只提供样式封装，不封装结构 B open 模式下 shadowRoot 外部可访问 ✓ 正确答案 C closed 模式下 shadowRoot 外部可访问 D attachShadow 无法设置 mode
# 16. Shadow DOM 的内存占用与 SSR 序列化的边界 A Shadow DOM 不产生额外内存开销 B 所有组件都应使用 Shadow DOM C DSD 序列化不会增加 HTML 体积 D adoptedStyleSheets 可减少多实例样式内存 ✓ 正确答案
# 17. Shadow DOM 在样式隔离与微前端的工程价值 A Shadow DOM 能隔离 JS 全局变量 B Shadow DOM 能拦截所有事件 C Shadow DOM 提供样式隔离，减少应用间样式冲突 ✓ 正确答案 D 微前端只需 Shadow DOM 即可完全隔离
# 18. CSS Shadow Parts（::part()、::slotted()、exportparts）的样式穿透 A ::part 是无条件穿透的全部样式 B ::slotted 选择内部未投射的节点 C exportparts 用于转发内部部件名给外部 ✓ 正确答案 D exportparts 无法用于嵌套组件
# 19. Shadow DOM 的 declarative Shadow DOM（<template shadowrootmode>）的工程价值 A 它必须依赖客户端 JS 创建影子根 B 它替代了自定义元素 C 它无法用于 SSR D 它通过模板声明实现无 JS 的影子 DOM 渲染 ✓ 正确答案
# 20. Shadow DOM 的 MutationObserver 跨边界（host vs shadow） A 宿主 observer 会自动观察影子内部变化 B 观察影子内部需在 shadowRoot 上单独建立 observer ✓ 正确答案 C MutationObserver 无法观察宿主插入 D 插槽变化只能通过 MutationObserver 感知
# 21. Shadow DOM 与 ARIA（无障碍）在跨树遍历的工程实践 A 无障碍树不会遍历影子内部 B 影子内部内容可被屏幕阅读器读取 ✓ 正确答案 C 跨树 aria-labelledby 引用完全不受限制 D 组件无需设置 role 即可无障碍
# 22. Shadow DOM 的 position: fixed 与浏览器渲染层的工程应用 A fixed 元素永远相对视口，不受祖先影响 B fixed 在 Shadow 内无法使用 C 祖先 transform 会改变 fixed 定位上下文 ✓ 正确答案 D 弹层只能渲染在 Shadow 内部
