随笔分类 - Js and css系列
脚本 样式
摘要：<template> <el-form ref="formRef" :model="form"> <el-form-item label="Multiple Files"> <el-upload multiple :headers="headers" // 一定要设置 :auto-upload="f
阅读全文
摘要：如果你不希望浏览器发送这些.map文件的请求，你可以在服务器配置中进行拦截，例如使用Nginx： location ~ \.map$ { deny all; }
阅读全文
摘要：参考资料：https://juejin.cn/post/7266641059282927650 效果： 源码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="
阅读全文
摘要：一个样式类，一个容器，无须额外元素：--main-color-rgba 为全局申明颜色变量，方便替换 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Loading Animation</title> <st
阅读全文
摘要：在密码校验规则中，经常遇到要求必须包含几种类型的符号要求，其中就会用到正则的正向预查，故略作语法解读： 在正则表达式中，(?=.*[a-z]) 的语法表示一个正向预查，其中： ?= 表示正向预查，用于检查紧随其后的内容。 .* 匹配任意字符零次或多次。 [a-z] 匹配任何小写字母。 因此，整个表达
阅读全文
摘要：代码： <html> <body> <input id="auto_split" /> </body> <script> document.querySelector('#auto_split').addEventListener('blur', function() { var val = thi
阅读全文
摘要：1、场景： chatGPT开发语音功能，部署服务需要https协议，有个独立的门户需要将服务以iframe嵌入到系统中 2、问题： chatGPT语音服务无法弹出授权开启麦克的提示 3、原因： iframe默认是关闭了相关权限 4、处理： 参考说明 <iframe>标签的 sandbox 属性是一个
阅读全文
摘要：javascript中比如int类型数值最大有效精度位数是16位，超过16位时就会四舍五入到前16位的精度，所以大于16位数字是无法比较大小的，故而只能封装独立的比较方法： /** * 数值大小比较（小于等于） -- 支持超过16位数 * @param min{string}: 要比较的数 * @p
阅读全文
摘要：场景： 地图框架Leaflet ，地图资源Open Street Map，要求实现内网加载地图资源。 必备资源：瓦片切割地图 -- Maperitive工具 （http://maperitive.net/） 通过generate-tiles，生成静态资源图片，部署到项目里或是静态资源服务里，将地图的
阅读全文
摘要：在动态页面语言中（如jsp），js变量赋值时常会用到EL表达式，而当值含义单引号或双引号时，就会解析出错。 解决方案: 先翻译为编码形式，然后解码（目前最简易方案） var name = unescape('${name.replaceAll("\'","%27").replaceAll("\"",
阅读全文
摘要：element-ui 使用中出现莫名黑色边框，如el-tabs、el-popover等 原因： outline样式导致 解决方案：（在对应的容器上加如下样式） .without-outline:focus { outline: none; } 或者覆盖样式： (不推荐，以tabs为例) .el-ta
阅读全文
摘要：项目中应用实例：（图曲率：0.1、0.5） 核心方法： function motion(radius) { // curvity: 曲率，值越大越接近圆的曲率 var i = 0, j = curvity = 0.05; return function() { i = i + j; /** * 阿基
阅读全文
摘要：知识点：Document.elementFromPoint() 返回当前文档上处于指定坐标位置最顶层的元素, 坐标是相对于包含该文档的浏览器窗口的左上角为原点来计算的, 通常 x 和 y 坐标都应为正数. js如下： function hasOverLayer(element) { let docu
阅读全文
摘要：1、为 String 扩展原型方法 byteLength()，该方法将根据每个字符编码，判断当前字符是单字节还是双字节，然后统计字符串的字节长度。 String.prototype.byteLength = function() { var length = 0; Array.from(this).
阅读全文
摘要：1、策略集中管理（耦合高）： 适合单一功能场景的维护 function Strategy(row) { // 配置策略，映射业务 let rules = { a: fna, b: fnb, c: fnc }, // 配置参数域，如果参数域不一致 fields = { a: 'a', b: 'a,b'
阅读全文
摘要：<style> .signal-week { position: relative; width: 120px; height: 10px; background-image: linear-gradient(90deg, #AADF6B, #A2DF6B, #67D972); border: 1p
阅读全文
摘要：迭代判断本身及祖先元素是否可见 /** * 判断元素是否可见 * @param el{dom}: dom元素 * @eg: isVisible(document.querySelector(cssSelector)); **/ function isVisible(el) { var loopabl
阅读全文
摘要：1、Sass -- vue解决sass-loader的版本过高导致的编译错误 Module build failed: TypeError: this.getResolve is not a function at Object.loader (C:\Users\Baicells\Desktop\h
阅读全文
