-
自定义元素是WebComponents标准中用原生JS定义含短横线标签（如my-button）的HTML扩展机制，需继承HTMLElement、注册后使用，支持shadowDOM封装、属性监听与事件派发。
-
浮动元素脱离文档流是因为float使元素从常规布局中抽离并允许内容环绕，导致父容器高度塌陷；清除浮动本质是触发BFC以包含浮动后代。
-
JavaScript模板引擎核心是将数据与模板结合生成HTML，通过正则解析{{}}插值和逻辑语法，拆分静态与动态部分，提取变量名并拼接为字符串，利用newFunction()将模板编译成可复用的渲染函数，提升性能。
-
可在VC中通过四种方法运行HTML文件：一、用系统默认浏览器双击打开；二、新版VS中使用“在浏览器中查看”菜单；三、拖拽HTML文件至浏览器窗口；四、用ShellExecute编程调用浏览器。
-
iframe依然可用但需谨慎，因其存在安全与性能问题；2.主要安全隐患包括点击劫持、钓鱼和XSS，可通过sandbox、allow属性、X-Frame-Options和CSP来规避；3.性能问题源于独立浏览上下文和资源消耗，可通过loading="lazy"、JavaScript动态加载和内容优化缓解；4.更推荐的替代方案包括API调用+客户端渲染、WebComponents、服务器端包含（SSI/SSR/ESI）和OEmbed协议；5.提升用户体验需采用响应式设计、加载状态提示、错误处理、可访问性支持（
-
JavaScript模块化开发是将代码拆分为独立、可复用、有明确依赖关系的文件，核心方式为ESModule（推荐）和CommonJS；ESM语法简洁、支持tree-shaking，需type="module"或.mjs；CommonJS适用于旧Node.js项目；实际项目需Vite或Webpack等工具支持路径别名、资源处理等；模块设计应单一职责、避免循环依赖、配合类型提示。
-
display:none使元素脱离文档流且不占空间，布局重排；visibility:hidden保留空间，布局不变，仅视觉隐藏。
-
标签模板字面量通过函数处理模板字符串，可实现如HTML转义等安全操作。
-
通过CSS变量与渐变结合实现主题切换，定义在:root和[data-theme="dark"]中的颜色与渐变可全局复用，利用var()引用--gradient-primary等变量，配合JavaScript切换data-theme属性，即可动态更新所有样式，包括背景渐变，无需重绘，性能更优。
-
正确实现背景渐变动画需使用@keyframes改变background-image的linear-gradient，确保0%与100%首尾连贯，配合animation-iteration-count控制次数，避免属性误用导致的跳变或断层。
-
首先确认Eclipse已安装Web开发组件，1、通过“Help”→“About”检查是否含EclipseWebDeveloperTools，否则从Marketplace安装；2、创建“DynamicWebProject”项目，将HTML文件置于WebContent目录下；3、右键项目选择“RunonServer”，配置并启动Tomcat服务器以部署运行；4、或使用“OpenWith”→“WebBrowser”通过内置浏览器快速预览；5、若页面未显示，检查“DeploymentAssembly”确保HTML
-
hover提示框闪烁的主因是用display切换显隐导致重排，正确做法是保持DOM存在，用visibility+opacity配合transition，且transition声明在默认样式中。
-
stroke-dasharray是SVG路径的虚线控制属性，需配合stroke-dashoffset和@keyframes实现“绘制”动画；必须用getTotalLength()获取真实路径长度并设为"LL"，初始offset为L、终点为0才能正确逐段显现。
-
本文详解如何用Puppeteer稳健实现逐页翻页爬取，解决因URL哈希跳转、异步导航未完成导致的重复抓取、页面错乱等问题，并提供可直接运行的修复代码与最佳实践。
-
CSS文字对齐不准主因是line-height与top作用机制混淆：line-height控制行框内单行文字居中，需容器高度≥font-size×1.2；top仅整体偏移元素，受字体基线、margin等影响；精准方案为line-height=容器高后用top微调或改用flex/grid。
