-
防抖和节流是前端优化高频事件的常用手段。防抖通过延迟执行，仅触发最后一次操作，适用于搜索框输入等场景；节流则保证函数在固定时间间隔内至少执行一次，适合滚动监听等持续触发的事件。两者核心区别在于执行频率控制策略不同，防抖关注最终状态，节流注重规律响应。
-
装饰器是用于扩展类、方法等行为的函数，通过@语法应用，可在运行时修改目标逻辑，常用于日志、权限控制、性能监控等场景，提升代码复用性与可读性。
-
元素选择器通过HTML标签名选中所有对应元素并应用统一样式，如设置p标签的字体、颜色和行高；常用于重置默认样式、建立基础排版和结构化布局，例如统一h1至h6的字体和颜色；因其作用范围广、优先级低，宜用于全局样式初始化，避免过度使用以防止冲突，推荐结合类选择器实现模块化设计。
-
Spring通过RESTAPI和WebSocket作为中间层，实现JavaScript与RabbitMQ的消息交互：1.Spring集成RabbitMQ并提供POST接口接收前端请求；2.JavaScript调用该接口发送消息，Spring将其转发至队列；3.消费者处理后通过WebSocket将结果推送给前端，完成双向通信。
-
答案：timing-function控制CSS动画的速度变化，常见值有ease、linear、ease-in、ease-out和ease-in-out，可使用cubic-bezier()自定义曲线，选择应基于动画行为和用户体验，如按钮点击用ease-out，加载旋转用linear，模态框弹出可用弹性曲线增加亲和力。
-
答案：JavaScript项目可通过DDD的分层与建模提升可维护性。具体包括：用ES6类实现实体与聚合根，如订单及其项；设计不可变值对象；按domain、application、infrastructure、interfaces划分职责；利用事件总线解耦逻辑，如订单创建后发布通知；在React/Vue中将状态管理交由领域模型，结合Redux/Pinia封装应用服务；Node.js中实现仓储模式抽象数据访问；通过工厂函数确保数据合法性，并对核心逻辑编写单元测试，最终聚焦业务本质而非形式复制。
-
答案：CSSGrid结合mediaquery与fr单位可实现响应式布局。通过媒体查询在不同屏幕宽度下调整grid模板列数，从移动端单列到桌面端多列；fr单位弹性分配空间，避免固定尺寸限制；配合minmax()与auto-fit可自动适应列数，适用于卡片、图库等场景，简化代码并提升维护性，同时需注意gap设置与最小宽度控制细节。
-
本教程旨在解决Bootstrap导航栏下拉菜单中，将多个交互元素（如登录按钮和注册链接）并排显示在同一行的问题。通过深入分析Bootstrap的布局机制，并结合CSS的display:inline-block属性，我们将演示如何优化下拉菜单内的表单布局，确保元素紧凑且功能完整，提升用户体验。
-
通过控制background-position位移、同步动画时间参数及使用CSS变量，可实现CSS动画与渐变色的流畅同步。
-
Promise.race用于获取最先完成的Promise结果，适用于超时控制、最快数据源响应、用户交互优先和检测服务可用性场景。
-
HTML水印通过CSS或JavaScript在网页叠加半透明标识，主要起视觉警示作用，无法真正阻止内容盗用。其核心实现方式是利用CSS定位与层叠（z-index）将水印置于内容上方，并设置透明度和pointer-events:none以保障可读性与交互性。常用方法包括：使用伪元素创建简洁文本水印、独立div实现复杂图案或图片平铺、JavaScript动态生成含用户信息的个性化水印。为确保跨设备一致性，推荐采用vw/vh等相对单位结合媒体查询调整尺寸与布局。尽管易被开发者工具移除，HTML水印仍具轻度威慑、
-
掌握CSS框架的实用类可快速调整布局与间距。1.使用m/p加方向和数值缩写（如mt-4、px-6）设置外边距和内边距；2.通过flex、justify-center、items-center等Flexbox类实现弹性布局，gap-4统一子元素间距；3.利用grid、grid-cols-3、col-span-2等Grid类创建多列网格并控制跨列；4.添加响应式前缀（如md:、lg:）实现不同屏幕下的间距与显示控制（如md:block），无需自定义CSS即可高效完成布局。
-
掌握CSS盒模型与定位机制的结合使用是实现精准布局的关键。采用box-sizing:border-box更利于尺寸控制；relative保留元素在文档流中的位置，可作为absolute定位的参考父级；absolute使元素脱离文档流，相对于最近的已定位祖先定位，适合弹窗、按钮等需要精确摆放的场景；fixed则让元素固定于视口，常用于导航栏或返回顶部按钮。通过合理搭配这三种定位方式与盒模型设置，能有效构建复杂且响应灵活的网页布局。
-
使用:checked伪类结合兄弟选择器可实现无JS的交互效果，如内容展开、主题切换等。通过隐藏checkbox并利用~或+选择器控制后续兄弟元素的显示状态，常用于折叠面板、标签页切换等场景，关键在于HTML结构顺序与选择器的正确配合。
-
::before是伪元素，用于在元素内容前插入装饰性内容。通过结合CSS渐变，可为标题等添加美观的渐变线条。例如，设置.header相对定位，其::before伪元素使用绝对定位、content为空字符串，并应用水平渐变背景linear-gradient(90deg,#ff7a00,#ff0080,#b200ff)，高度4px，置于顶部，形成横向装饰条。还可调整方向实现垂直渐变，或添加border-radius、动画等增强视觉效果，灵活实现现代UI装饰需求。
