-
使用CSSGrid的grid-template-columns配合auto-fit和minmax可实现响应式图片墙:.image-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;}auto-fit会自动填充并拉伸列以适配容器,避免空白;minmax(200px,1fr)确保每列最小200px、最大等比分配。大屏显5列、平板3列、手机1列,无需媒体查询。与auto-fill不同,auto-
-
纯前端HTML+JavaScript即可实现在线SQL格式化工具,通过<script>引入jsDelivrCDN上的sql-formatter@14.1.0UMD版本,全局获得sqlFormatter对象,调用sqlFormatter.format(sql,{language:'mysql',indent:'',keywordCase:'upper'})即可完成格式化,无需后端、不发请求、不传数据;需显式指定language防止语法解析错误,并预清理不可见Unicode字符。
-
用div创建宽高盒子需同时设置width和height,并推荐添加background-color确认显示;常见不显示原因包括父容器无高度、display被修改、CSS权重不足、overflow裁剪等。
-
Less4.2.0是当前最新稳定版,不支持原生List/Map类型及list-append()、map-keys()等语法;所谓“Less4.0新特性”属误传,其核心设计坚持静态替换,仅提供extract()和length()处理空格分隔值序列。
-
使用LiveServer插件是VSCode中运行HTML文件的最佳方式,安装后右键选择“OpenwithLiveServer”即可在浏览器中实时预览并自动刷新页面。
-
list-style-type仅对<ol>有效,常见值有decimal、lower-roman、upper-alpha和none;自定义序号需用counter-reset、counter-increment和::before;缩进应调padding-left而非text-indent;移动端序号截断需检查overflow和父容器min-width。
-
根路径href、语义化nav结构、aria-current标记当前页、external链接配rel="noopener"、动态路径由模板函数生成,确保全站链接一致可维护。
-
<address>标签专用于声明页面或文章的责任人联系信息,如作者、维护者邮箱或官网链接;仅允许嵌套<a>、<em>、<br>等短语内容,作用域限于最近<article>或<body>顶层,不可用于普通地址或跨作用域混用。
-
计算属性因依赖字段未初始化而崩溃,本质是生命周期与依赖声明顺序不匹配;需确保data/setup中提供安全初始值,防御性处理异步数据,并避免在初始化阶段手动触发求值。
-
AbortSignal.timeout仅在Chromium120+、Firefox125+、Safari17.4+原生支持,旧版抛TypeError;需运行时检测,降级须用Promise.race且注明网络层未中断;timeout单位为毫秒但建议配置用秒并校验,Node.js行为与浏览器不等价;熔断需区分错误类型,timeout时error.code为'ABORT_ERR';并发请求必须独立signal,避免误中断。
-
Vue中emit是子组件向父组件通信的唯一合规方式,需用defineEmits声明事件名后调用emit发送;父组件通过@事件名监听,支持Promise异步响应与TypeScript类型约束。
-
答案:推荐优先使用扩展运算符合并对象,因其语法简洁、不修改原对象且可读性强;若需兼容老浏览器则选用Object.assign()。两者均为浅合并,深层合并需借助其他方法。
-
JavaScript缓存函数的核心是用对象或Map缓存参数组合与结果,相同输入直接返回缓存值;适用于纯函数如斐波那契、阶乘等;基础版支持单基本类型参数,增强版用JSON.stringify处理多参但有局限,生产级推荐Map加自定义键生成器,并注意纯函数约束、内存泄漏和异步缓存等问题。
-
OffscreenCanvas在Worker中可用,但必须由主线程通过transferControlToOffscreen()创建并移交控制权,Worker内直接new会报TypeError:Illegalconstructor;需验证typeofOffscreenCanvas!=='undefined'且配合主线程canvas实例使用。
-
flex-grow控制子元素在容器有剩余空间时的扩展比例,flex-shrink决定空间不足时的收缩行为。默认flex-grow:0不扩展,flex-shrink:1可等比收缩。通过设置不同值可实现内容区自动填满、防止输入框压缩等布局效果。推荐使用flex简写如flex:1(等价于flex:110%)或flex:10auto,并配合min-width:0解决收缩失效问题,从而构建自适应弹性布局。