- 博客(332)
- 收藏
- 关注
RSS订阅
原创 css+ vw&rem 自适应布局
对于 ipone6100vw = 750px1px = 100vw/750100px= 10000vw/750=100vw/7.5html:font-size->1rem->100vw/7.5=100px在750尺寸下布局完成，在其他尺寸自适应举例子在375按道理rem应该等于50px 就可以等比缩放看看这个式子在375下是否是50px100vw/7.5=375p...
2019-09-20 17:19:01
484
原创 富文本动态切换label颜色
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> #e1{ width: 700px; height: 300px; border:2px solid aqua; ...
2019-12-31 15:23:21
522
原创 echarts 柱状图item颜色自定义
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> #e1{ width: 700px; height: 300px; border:2px solid aqua; ...
2019-12-30 09:14:59
1099
转载 Await Async 处理串行
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> </body> <script type="text/javascript"> const...
2019-12-15 20:43:34
192
原创 正则 前瞻后顾
前瞻： exp1(?=exp2) 查找exp2前面的exp1后顾: (?<=exp2)exp1 查找exp2后面的exp1负前瞻: exp1(?!exp2) 查找后面不是exp2的exp1负后顾: (?<!exp2)exp1 查找前面不是exp2的exp1注意：前瞻、后顾、负前瞻、负后顾， 这些表达式只是表示一个位置，跟^与$表示开始与结束一样...
2019-12-09 22:26:13
301
原创 正则 - 截取某个字符后面所有内容
function strSplit(str){ let exp = /(?<=(-)).*/g; str = str.match(exp)[0]; return str }
2019-12-05 13:34:04
9434
4
原创 JS变量和函数与作用域
在js中，一个变量名进入作用域的方式有4种：Language-defined：所有的作用域默认都会给出this和arguments两个变量名;Formal parameters（形参）：函数有形参，形参会添加到函数的作用域中;Function declarations（函数声明）：如function foo() {};Variable declarations（变量声明）：如var fo...
2019-12-01 22:50:30
91
原创 JS-作用域-全局作用域-函数作用域
函数能获取到的VO只和函数定义所在的域有关，与其执行所在域无关var str = 'global';function printStr() { console.log(str);}function testScope() { var str = 'local'; printStr();}printStr(); // 毫无疑问，输出 "global"te...
2019-12-01 22:27:25
90
原创 JS预编译 只定义 不进行 = 运算
预编译过程没有 = 的运算let obj = { a:'sssss', b:(function(){ console.log(this.obj) return this })() }
2019-12-01 22:10:02
137
原创 JS 预编译 初识
function fn(a){ console.log(a); var a = 123; console.log(a); function a(){}; console.log(a); var b = function(){}; console.log(b); function d(){}; } ...
2019-12-01 14:39:32
369
原创 模拟事件监听 触发 移除 + 模块化 +数组 扁平化
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> </body> <script type="text/javascript"> let E...
2019-12-01 12:21:00
187
原创 获取数组里的obj 的所有属性名的集合 + 数组扁平化
function getArrObjAttrValue(obj) { if (obj.constructor != Array) return; if (!obj || obj.length == 0) return; let valList = [] obj.forEach(item => { valList.push(Object.keys(item))...
2019-12-01 12:19:34
194
原创 apply - call 调用非数组方法 Math.max forEach
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> </body> <script type="text/javascript"> var a...
2019-12-01 09:45:05
187
原创 apply-call 使用 [一] 数组作为参数 调用数组的方法
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> </body> <script type="text/javascript"> funct...
2019-12-01 09:38:05
417
转载 flex align-items aling-content
align-items 每一个item 在当前轴的交叉轴垂直居中align-content 整个 flex容器 在当前 轴的交叉轴垂直居中转载 https://blog.csdn.net/cc18868876837/article/details/88138057...
2019-11-29 22:47:50
130
原创 双向绑定-原生
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> input1<input type="text" id="input1"> input2<in...
2019-11-25 17:25:32
100
原创 Date将今天00:00 到 Now 做区间划分
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> </body> <script type="text/javascript"> let d...
2019-11-22 16:53:28
163
原创 数组取倒数几个元素形成一个新的数组 SLICE(-x)
let arr = [1,2,3,4,5,6,7]arr.slice(-2) ⇒ [6.7]arr.slice(-10) ⇒ [1,2,3,4,5,6,7]
2019-11-21 17:25:54
1341
原创 媒体查询
<link rel="stylesheet" media="(max-width: 1279px)" href="1279.css"> <link rel="stylesheet" media="(min-width: 1280px)" href="1280.css">
2019-11-21 09:23:35
64
原创 选择器 select option:selected
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <select id="select"> <option value ="A">111&...
2019-11-18 13:30:35
1169
原创 CSS NOT 搭配其他选择器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...
2019-11-18 13:23:09
182
原创 Echarts 自定义 tooltip
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> .p200box{ position: absolute; left: 50%; transform: tr...
2019-11-17 19:28:38
169
原创 Date 匹配 YYYY/MM MM/DD
let ymExp = /^\d{4}(\-|\/|\.)\d{1,2}$/g let mdExp = /^\d{2}(\-|\/|\.)\d{1,2}$/g
2019-11-15 17:23:17
146
原创 Date 计算任意两天的天数差
function GetDateDiff(startDate, endDate) { startDate = startDate.toString() endDate = endDate.toString() var startTime = new Date(Date.parse(startDate.replace(/-/g, "/"))).getTime(); var e...
2019-11-15 17:21:52
710
原创 Date 获取本月的天数
function getMonthDays(date) { var year = date.getFullYear(); var month = date.setMonth(date.getMonth() + 1); date.setDate(0); return date; }
2019-11-15 17:19:40
1520
原创 css + 比较复杂的css选择器
1.多个not连用形成且条件多个not table tr td:not(:first-child):not(:last-child){ color:red; }
2019-11-12 17:26:53
287
原创 less 入门
//变量@color-pink:pink;@color-green:green;@color-red:red;@rem-1:1rem;@rem-2:2rem;*{ margin: 0; padding: 0;}html{ font-size: calc(100vw/13.66);}div,p{ height:1rem;}div{ background: @col...
2019-11-03 11:17:36
116
原创 table td 宽度生效规则
1.table宽度固定td宽度（px percent）和小于table的自动分配td宽度（px percent）和大于table在td文本被挤在一起时，当前元素宽度有效，其余被压缩2.table宽度不固定(首先table不能设置100%)百分比 px 都无效font-size padding 有效...
2019-11-02 17:49:14
442
原创 css 之 viewport
1.布局视口2.视觉视口3.理想视口布局视口是开发者布局使用的宽度视觉视口是可见宽度在移动端 一般视觉视口小于布局视口，为了能在手机上完美展示页面，让布局视口和视觉视口相同就是解决办法...
2019-11-02 09:41:50
208
原创 table 布局坑 - 4 td width 未按照理想中的值设定，按时却又按照设置的比例布局
<html> <head> <title>测试</title> <style type="text/css"> * { padding: 0; margin: 0; } .table { table-layout: fixed; } </style> </...
2019-11-01 17:56:09
151
原创 浏览器常用宽高
pageX pageY 到html,body最左侧和最顶部的距离，而不是可视的宽高。html,body{w2000,h2000}此时的pageX 和 pageY 达到了 2014 2010滚动条已经到达最顶端clientX clientYclientX clientY 只能达到1670左右，说明相对浏览器可视宽度offsetX offsetY ？？？...
2019-11-01 16:54:23
312
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人