作用域

var的主要作用是声明变量，其作用域为函数作用域或全局作用域，且存在变量提升和可重复声明的问题；2. 现代javascript更推荐使用let和const，因为它们具有块级作用域、不存在重复声明问题，并能避免暂时性死区之外的访问错误；3. 变量命名应遵循驼峰命名法，使用语义明确的名称，避免保留字和泛…

标签定义惰性html片段，页面加载时不渲染、不执行脚本、不加载资源；2. 使用javascript克隆其content属性（documentfragment）后插入dom才能激活内容；3. 相比display: none的隐藏div，不创建dom节点、不占用布局计算、更优性能；4. 在web com…

要为html表格添加背景色，核心是使用css的background-color属性，可通过内联样式、内部样式表或外部css文件实现；推荐使用内部或外部css以提升可维护性。1. 可为整个table设置背景色以定义整体基调；2. 通过th和td分别设置表头和数据单元格的背景色，增强视觉区分；3. 利用…

浏览器通过解析html文件构建dom树，将字节流解码为字符，进行词法分析生成tokens，再通过语法分析组织成树状结构；2. 同时构建cssom树，两者合并为渲染树，经过布局和绘制最终呈现页面；3. 修改html的方式包括文本编辑、javascript操作dom、服务器端渲染（ssr）或静态站点生成…

slot 标签是 web components 中用于内容分发的核心机制，它允许外部内容通过默认插槽和具名插槽两种方式投射到自定义元素的指定位置；1. 默认插槽接收所有未指定 slot 属性的子元素；2. 具名插槽通过 name 属性与外部元素的 slot 属性匹配，实现精准内容分发；组件内部可通过…

内联样式最适合用于快速调试、javascript动态生成样式、邮件模板及一次性样式覆盖，优点是优先级高、即时生效，缺点是难以维护、代码冗余、可读性差、违背内容与表现分离原则；解决方案包括优先使用外部样式表、善用css类和id、利用css变量、通过javascript操作类名而非内联样式、采用css预…

shadow dom通过创建独立的dom子树实现组件样式封装，解决了全局css带来的命名冲突和样式污染问题。其核心机制是为宿主元素创建shadow root，形成隔离的渲染作用域，内部样式仅作用于该子树。1. 它防止样式泄露与渗透，确保组件外观稳定；2. 提供两种模式：open（便于调试）与clos…

html的标签主要作用是存储未激活的html内容片段。1. 它在页面加载时不被渲染或执行，保持惰性状态，直到javascript显式克隆并插入到dom中；2. 与隐藏的div相比，内部的内容不会消耗资源，如加载图片或构建dom树；3. 常用于构建可复用ui组件、延迟加载内容，并结合web compo…

javascript中symbol类型通过生成唯一值有效避免属性名冲突。每次调用symbol()都会创建一个与其他symbol绝不相等的值，即使描述相同；将symbol作为对象属性键时，不会与字符串键或其他symbol键冲突，确保不同模块或库可在同一对象上安全存储数据；symbol属性默认不可枚举，…