-
HTML图片居中需按场景选方法:父容器设text-align:center(行内场景)、图片设display:block+margin:auto(块级首选)、Flex布局(现代推荐),禁用已废弃的align属性。
-
drop事件不触发是因为目标元素未监听dragover并调用e.preventDefault(),这是浏览器启用投放许可的唯一前提;仅监听drop而忽略dragover会导致静默失败。
-
JavaScript通过CanvasAPI操作<canvas>元素,需先获取2D/WebGL上下文,设置宽高属性,再调用绘图方法实现静态绘制、requestAnimationFrame动画循环及鼠标交互响应。
-
直接在父元素加transition对子元素无效,因为CSS过渡只作用于自身显式声明变化的属性,不继承或代理到子元素;子元素需单独声明transition才能生效。
-
双飞翼布局通过三层嵌套与负margin实现主内容优先渲染且避免浮动塌陷,核心是HTML结构中main前置、浮动仅视觉位移,需外层容器伪元素clear:both彻底清除浮动。
-
频繁DOM操作引发重排重绘,降低性能。应缓存DOM引用、批量更新使用DocumentFragment、避免强制同步布局,并通过事件委托减少监听器数量,从而减少操作次数与浏览器回流。
-
使用CSS创建动态百分比仪表盘需结合HTML结构、CSS样式与JavaScript控制,核心是利用border-radius创建半圆形容器,通过transform:rotate()配合transform-origin控制填充元素的旋转角度,结合transition实现平滑动画,并用overflow:hidden裁剪超出部分以形成扇形填充效果;2.JavaScript通过获取湿度值并映射到0-180度(半圆)或0-360度(全圆)的角度范围,动态更新gauge-fill元素的transform属性,同时刷新
-
TensorFlow.js是Google推出的JavaScript库,可在浏览器或Node.js中运行机器学习模型,支持WebGL加速和GPU计算,适用于实时推理与交互式AI应用;它完全用JavaScript编写,前端开发者易上手,可训练模型或加载已转换的TensorFlow/Keras模型,与React、Vue等框架兼容;通过npm安装并导入后,可实现如线性回归等简单模型训练;支持图像分类(MobileNet、ResNet)、自然语言处理、姿态识别(PoseNet、BodyPix)及生成模型(GANs)
-
表单提交关键在name属性和submit绑定——无name字段后端收不到;button需type="submit"且在form内,form需action;inputtype决定校验、键盘等行为;checkbox/radio须设value;JS拦截需preventDefault。
-
隐式类型转换在JavaScript中常见于==比较、字符串拼接和条件判断,如0==false为true、5+"px"得"5px",且if("0")为真;特殊情况下null与0、false比较均不等,而[]==![]却为true,因对象转原始值规则导致;为避免风险,应使用===、显式转换类型并提前校验数据。
-
字体路径错误和font-display缺失是@font-face失效主因;路径须相对CSS文件,优先用link引入字体,声明woff2/woff双格式并添加font-display:swap避免文字闪动。
-
焦点捕获(trapfocus)是手动限制键盘Tab键在模态框内循环聚焦的技术,因HTML原生不支持且dialog元素不自动限制Tab范围,必须用JS监听keydown、判断首尾可聚焦元素并强制focus,以满足WCAG2.1AA可访问性要求。
-
currentColor是CSS关键字,代表元素自身的color计算值;它使SVG图标通过fill/stroke使用currentColor并配合color设置即可自动响应文字颜色变化,包括伪类、JS等动态场景。
-
~选择器用于选中某元素后所有同级兄弟元素,如.container>div~div{margin-top:16px;}可为非首个div添加上边距,实现均匀间距且避免首尾冗余空白。
-
Less编译后CSS不热更新,需检查构建工具是否监听.less文件:Webpack需配置style-loader(hmr:true)、css-loader、less-loader链路完整;Vite需启用vite-plugin-less;Parcel需确认未禁用transformer-less。