-
使用position:fixed可让元素相对于视口固定,常用于导航栏、返回顶部按钮等;通过top、bottom、left、right定位,需注意脱离文档流、层级覆盖及移动端兼容性问题。
-
用canvas绘制文字水印最可靠,需图片onload后drawImage,设置textBaseline和textAlign居中对齐,globalAlpha控透明度,toDataURL导出时注意跨域、MIME类型及质量参数,斜向平铺需save/restore+translate+rotate,前端水印仅防误用,防窃取须服务端生成。
-
HTML5文档默认使用http://www.w3.org/1999/xhtml命名空间,无需手动声明xmlns;仅XHTML(application/xhtml+xml)场景下xmlns才必需且生效,HTML模式下其值恒为null。
-
箭头函数是JavaScript中语法更简洁的函数定义方式,无自身this、arguments、super或new.target,不可用作构造函数,适合回调等需词法this绑定场景,复杂逻辑仍推荐传统函数。
-
line-clamp需配合display:-webkit-box和-webkit-box-orient:vertical使用,仅WebKit有效;Firefox需JS测行数fallback;展开动画宜用scrollHeight计算高度而非max-height;SSR需服务端预估+客户端校准。
-
JavaScript数据验证常用正则表达式(RegExp)来匹配字符串格式,判断输入是否符合预期规则,比如邮箱、手机号、密码强度等。核心是用test()或match()方法结合预定义的正则模式进行校验。常见字段的正则验证写法直接在表单提交或输入事件中调用验证函数,返回布尔值即可判断是否合法:邮箱验证:/^[^\s@]+@[^\s@]+\.[^\s@]+$/——确保含一个@、至少一个点,且前后非空格或@符号手机号(中国大陆):/^1[3-9]\d{9}$/——匹配
-
必须用watch监听路由参数变化以触发重新请求,推荐精准监听特定参数(如route.params.id)并设immediate:true;需手动清理旧状态、取消请求、重置loading和数据。
-
Flex布局实现按钮组对齐需设容器display:flex,用justify-content控制主轴分布(如center、flex-end等),推荐用gap代替margin,配合align-items可垂直居中。
-
真正能跑起来、可调试的“第一个程序”需绕开本地文件协议限制、script加载时机和var作用域陷阱:用http-server或LiveServer启动,script放</body>前或加defer,优先使用let/const避免变量提升问题。
-
Vue模板空值处理应提前兜底、按需判断、合理默认:用?.安全访问嵌套属性(Vue3.4+),搭配??设默认值;v-if显式控制渲染;computed/method封装复杂逻辑;统一初始化响应式数据。
-
JS读取CSS自定义变量需确保变量已作用于目标元素(如:root或元素自身),再用getComputedStyle(el).getPropertyValue('--var')获取,注意双短横、返回字符串、空字符串非undefined;动态修改用setProperty仅限当前元素,IE不支持,需兼容处理。
-
JavaScript通知API需先获用户授权,通过Notification.requestPermission()请求,获准后用newNotification()创建提醒,并支持点击跳转等交互,同时需处理不兼容或拒绝情况,确保体验友好。
-
使用RGBA/HSLA设置颜色透明度可精准控制元素的透明通道,避免opacity导致的全局透明问题,常用于背景遮罩与视觉叠加,如模态框、卡片层等场景,结合backdrop-filter可实现模糊玻璃效果,提升界面层次感与现代感。
-
transition与color结合可实现颜色平滑渐变,常用于按钮悬停、主题切换等场景。通过设置transition:color0.3sease等语法,使文字、背景、边框等颜色变化更自然。需明确初始颜色,避免使用transition:all,以提升性能和效果稳定性。
-
z-index不生效的常见原因包括元素未定位、层叠上下文限制及z-index值相同。1.元素必须设置position为relative、absolute、fixed或sticky,否则z-index无效;2.不同层叠上下文中的元素,其堆叠顺序由各自上下文在父级中的层级决定,子级z-index再高也无法突破父级上下文;3.同一层叠上下文中z-index相同则后渲染的元素覆盖前者。排查时应检查元素是否定位、查看祖先元素是否创建了层叠上下文(如opacity小于1、transform、filter等属性),并逐