-
position:relative实现自身偏移时，元素在原占位处视觉偏移而不影响文档流；其父元素设relative后成为子absolute元素的定位上下文；未写top/left则无偏移，仅开通定位权限；transform:translate()更优但不创建定位上下文。
-
将CSS工具与Grid布局结合可提升开发效率和响应式能力。1.使用Tailwind等工具类快速创建Grid容器，如gridgrid-cols-3gap-4实现三列布局；2.通过col-span-2、col-start-2等类精准控制网格项位置；3.利用md:grid-cols-2lg:grid-cols-4等前缀实现无需媒体查询的响应式设计；4.自定义Grid模板结合工具类处理复杂结构，兼顾语义与样式便捷性。分工明确，布局更灵活高效。
-
JavaScript设计模式是解决特定问题的成熟思路，提升可维护性、复用性和协作效率；最常用4种为模块模式、观察者模式、工厂模式、单例模式。
-
判断字符串是否为空需根据场景选择方法，基础情况可用!str检测null或undefined，仅判断空字符串用str===''，推荐使用!str||str.trim()===''处理包含空白字符的情况，可封装为isEmpty(str)函数复用，有效避免空格导致的逻辑错误。
-
CSS选择器对动态插入元素不生效，因其依赖静态匹配机制，仅在首次渲染或重排时扫描DOM；新节点若未显式携带匹配所需class/id等属性，则无法触发样式计算。
-
WebRTC是基于JavaScript的浏览器端实时音视频通信标准，通过MediaDevices、RTCPeerConnection和RTCDataChannel三大API实现P2P音视频通话与数据传输，需信令服务器交换SDP和ICE候选以建立连接。
-
1.隐藏原生控件，使用opacity:0和定位覆盖自定义样式；2.通过label与span构建结构，用:checked状态切换样式；3.单选按钮需保持name一致并使用圆形样式；4.确保无障碍支持。通过将原生input设为透明并绝对定位，使其覆盖在自定义元素上，点击视觉按钮即触发原生控件，同时利用CSS的:checked伪类改变外观样式，复选框与单选按钮结构相似，但单选按钮需互斥选择且样式为圆形，此外必须设置label的for属性及保留键盘导航以保证可访问性。
-
ES6模块与CommonJS本质不同：ES6是编译时静态加载、顶层导入、活绑定导出；CommonJS是运行时动态加载、任意位置require、值拷贝导出；混用易致ReferenceError或空模块。
-
JavaScript对象首选字面量{}创建，注意引用赋值陷阱；Object.defineProperty可精细控制属性特性；in、hasOwnProperty、Object.keys等方法查询范围不同；delete删除属性而赋值undefined仅设值。
-
使用order属性可改变Flex子元素显示顺序，数值小的优先排列，结合flex-direction可调整主轴方向，常用于响应式布局中不改变DOM结构的情况下调整视觉顺序。
-
:nth-of-type按标签类型精准选择子元素，如p:nth-of-type(2)选第二个p；可用于隔行变色tr:nth-of-type(even)、控制嵌套结构h2:nth-of-type(1)，并支持an+b公式灵活选中目标。
-
动态添加的HTML元素在表单提交后立即消失，根本原因是表单默认提交行为导致页面刷新，且DD元素未正确追加文本节点。本文详解修复方法：阻止默认提交+修正DOM构建逻辑。
-
是的，多个<link>标签会拖慢页面，尤其在HTTP/1.1下引发连接排队与渲染阻塞；HTTP/2虽缓解但仍有开销；弱网下小文件丢包率更高；应合并通用样式、响应式CSS及稳定preload资源，但第三方库、按路由异步样式及关键内联CSS除外；推荐构建时自动合并并确保缓存校验准确。
-
JavaScript打印功能核心是window.print()触发+@mediaprint样式控制+DOM预处理。需隐藏非内容元素、强制分页、避免截断，并注意图片路径、字体兼容及浏览器差异。
-
HTML5注释不会报错但会干扰解析逻辑，未闭合注释会导致后续代码被吞掉，引发页面空白、样式失效等问题；应检查注释配对、避免嵌套、禁用功能时优先用条件判断而非注释HTML。
