-
捕获阶段事件从最外层向下传播至目标元素，可通过addEventListener第三参数true在捕获阶段处理；2.目标阶段事件到达绑定元素，event.target指向触发元素；3.冒泡阶段事件从目标向上逐层传递，多数事件默认冒泡，监听器默认在此阶段触发。理解三阶段有助于控制事件流，如阻止冒泡或捕获阶段拦截。
-
HTML输入框的核心在于灵活使用<input>标签的type属性及辅助属性。type决定输入框类型，如text、password、email等，控制数据类型与交互逻辑；name用于表单提交时的字段标识，id实现元素唯一引用并与label关联，placeholder提供输入提示，value设定默认值，required、maxlength、pattern等属性则增强验证与用户体验。结合autocomplete、autofocus、list与datalist等属性，可进一步优化输入效率与可访问性。正
-
使用clearTimeout清除setTimeout，2.使用clearInterval清除setInterval，3.组件化开发中在卸载时清除，4.保存定时器ID并及时清除避免内存泄漏。
-
overflow属性用于控制内容溢出容器时的行为，核心值包括visible（默认，内容溢出显示）、hidden（裁剪溢出内容）、scroll（始终显示滚动条）和auto（仅在溢出时显示滚动条）；2.它能解决视觉溢出问题但非万能，无法根治浮动导致的高度塌陷或绝对定位元素溢出等布局问题；3.overflow:auto按需显示滚动条更省空间且体验佳，scroll则强制显示滚动条适合作为可滚动提示；4.响应式设计中需避免hidden误删内容、防止双重滚动条、注意可访问性，并善用overflow-x:auto处理表
-
一、使用HTML与CSS通过:hover实现静态下拉菜单，结构包含触发元素和隐藏的ul列表，CSS控制显示与定位。二、结合JavaScript实现动态控制，通过点击事件切换display属性，并监听文档点击关闭菜单。三、使用<select>和<option>创建表单下拉框，支持默认选中、多选等特性，浏览器原生兼容。四、利用Bootstrap框架引入dropdown类与data-bs-toggle属性，快速构建响应式下拉菜单，需正确加载依赖文件以确保功能正常。
-
答案：实现HTML代码复用的常用方法包括JavaScript动态加载、服务器端包含（SSI）、模板引擎预处理、WebComponents封装和构建工具模块化导入。首先利用JavaScript通过fetchAPI将外部HTML文件注入指定容器，适用于前端动态插入公共部分；其次在支持SSI的服务器上使用<!--#includefile="nav.html"-->语法由服务器合并内容；再者采用EJS、Pug等模板引擎在构建阶段渲染带变量的HTML模板；接着通过WebCompone
-
模块联邦是Webpack5实现微前端的核心技术，允许运行时动态加载远程应用模块。通过ModuleFederationPlugin配置host、remote和shared，实现应用间组件共享与独立部署，提升协作效率与性能，但需注意依赖兼容性、调试复杂度和网络延迟问题。
-
使用Foundation框架可快速构建响应式卡片网格。通过引入CSS文件后，利用.grid-x和.cell结合medium-4、small-12等类实现多列布局，嵌套.card组件（含.card-section、.card-image等子类）增强样式，配合不同断点设置如large-3实现自适应排列，无需自定义CSS即可完成美观布局。
-
理解层叠上下文是解决absolute定位中z-index失效的关键，opacity、transform等属性会创建新的层叠上下文，限制子元素层级比较范围，导致即使高z-index也无法覆盖外部元素；应避免在非必要容器上使用这些属性，合理规划z-index分层体系（如背景0-1、内容2-5、悬浮层10-20、模态框100），并确保absolute元素位于relative容器内以正确建立定位与层叠关系，通过结构化类名统一管理层级，从而有效控制显示顺序。
-
防范XSS需坚持输入验证、输出编码和CSP三重防御。输入验证通过白名单确保数据合法，但无法单独阻止XSS；输出编码才是关键，须根据HTML上下文对特殊字符进行正确编码，防止恶意脚本执行；CSP作为浏览器层的纵深防御，限制资源加载与执行，即使注入也难以生效。此外，HttpOnlyCookie可防会话劫持，WAF提供额外防护。单纯依赖输入过滤不可靠，因攻击者易绕过且上下文变化影响安全性。正确做法是全流程设防：入口严审、出口细编、浏览器端加策，结合成熟框架与持续优化的CSP策略，构建多层、动态的安全体系。
-
答案：通过父元素设置position:relative建立定位上下文，子元素使用position:absolute实现相对于父元素的精确定位，常用于角标、悬浮按钮等布局场景。
-
答案：JavaScript中对象拷贝与不可变更新是状态管理核心，浅拷贝仅复制第一层属性，深拷贝递归生成独立对象，不可变更新需返回新对象避免直接修改原状态，React中推荐使用展开语法或Immer.js处理复杂结构。
-
首先建立WebSocket连接并监听事件，然后实现自动重连与心跳机制以确保稳定性。
-
HTML中的上下标标签<sup>和<sub>在数学公式（如x2）、化学式（如H2O）、脚注引用（如参考文献1）、序数词（如1st）及物理量（如VRMS）等场景中具有重要应用，既能实现视觉上的高低排版，又赋予文本明确的语义含义；2.除了使用默认标签，可通过CSS的vertical-align:super/sub、font-size调整以及position:relative结合top或bottom属性来自定义上下标的大小与位置，实现更精确的视觉控制；3.常见排版问题包括上下标导致行高不
-
JavaScript私有字段（#）是运行时强制的真正私有，TypeScriptprivate仅是编译时检查，生成的JS中无保护，前者更安全后者用于开发约束。
