JS Code block 代码块–颜色
星期一, 2023-04-17 | Author: Lee | computer, 前端 | 1,231 views
颜色
匹配rgba的正则
匹配透明度为0的rgba正则
hex转换为RGBA
rgb转Hex
获得随机的颜色值
是否为有效的16进制颜色
/** * 匹配rgba的正则 * @returns {RegExp} */ function regexRgba () { return /^[rR][gG][Bb][Aa]?[\(]([\s]*(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?),){2}[\s]*(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?),?[\s]*(0\.\d{1,2}|1|0)?[\)]{1}$/g } /** * 匹配透明度为0的rgba正则 * @returns {RegExp} */ function regexRgbaByZeroOpacity () { return /^[rR][gG][Bb][Aa]?[\(]([\s]*(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?),){2}[\s]*(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?),?[\s]*0[\)]{1}$/ } /** * hex转换为RGBA * @param hex 格式颜色 * @param opacity 透明度 * @return {string} */ function hexToRgbA(hex, opacity = 1) { let c; if (/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)) { c = hex.substring(1).split(''); if (c.length === 3) { c = [c[0], c[0], c[1], c[1], c[2], c[2]]; } c = '0x' + c.join(''); return 'rgba(' + [(c >> 16) & 255, (c >> 8) & 255, c & 255].join(',') + `,${opacity})`; } throw new Error('Bad Hex'); } /** * rgb转Hex * @constructor */ function RGBToHex (r, g , b) { return ((r << 16) + (g << 8) + b).toString(16).padStart(6, "0") } /** * 获得随机的颜色值 * @return {String} 返回随机的颜色字符串 */ function getRandomColor() { return ( '#' + Math.random() .toString(16) .substring(2) .substr(0, 6) ); } /** * 是否为有效的16进制颜色 * @param {string} val * @returns {boolean} * @example * isValidHexadecimalColor('#f00'); * // => true * isValidHexadecimalColor('#fe9de8'); * // => true */ function isValidHexadecimalColor(val) { const reg = /^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/; return reg.test(val); } |
文章作者: Lee
本文地址: https://www.pomelolee.com/2381.html
除非注明,Pomelo Lee文章均为原创,转载请以链接形式标明本文地址
No comments yet.
Leave a comment
Search
相关文章
热门文章
最新文章
文章分类
- ajax (10)
- algorithm-learn (3)
- Android (6)
- as (3)
- computer (85)
- Database (30)
- disucz (4)
- enterprise (1)
- erlang (2)
- flash (5)
- golang (3)
- html5 (18)
- ios (4)
- JAVA-and-J2EE (186)
- linux (143)
- mac (10)
- movie-music (11)
- pagemaker (36)
- php (50)
- spring-boot (2)
- Synology群晖 (2)
- Uncategorized (6)
- unity (1)
- webgame (15)
- wordpress (33)
- work-other (2)
- 低代码 (1)
- 体味生活 (40)
- 前端 (21)
- 大数据 (8)
- 游戏开发 (9)
- 爱上海 (19)
- 读书 (4)
- 软件 (3)