- 博客(332)
- 收藏
- 关注

原创 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
544
原创 富文本动态切换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
682
原创 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
1177
转载 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
252
原创 正则 前瞻后顾
前瞻: exp1(?=exp2) 查找exp2前面的exp1后顾: (?<=exp2)exp1 查找exp2后面的exp1负前瞻: exp1(?!exp2) 查找后面不是exp2的exp1负后顾: (?<!exp2)exp1 查找前面不是exp2的exp1注意:前瞻、后顾、负前瞻、负后顾, 这些表达式只是表示一个位置,跟^与$表示开始与结束一样...
2019-12-09 22:26:13
339
原创 正则 - 截取某个字符后面所有内容
function strSplit(str){ let exp = /(?<=(-)).*/g; str = str.match(exp)[0]; return str }
2019-12-05 13:34:04
9687
4
原创 JS变量和函数与作用域
在js中,一个变量名进入作用域的方式有4种:Language-defined:所有的作用域默认都会给出this和arguments两个变量名;Formal parameters(形参):函数有形参,形参会添加到函数的作用域中;Function declarations(函数声明):如function foo() {};Variable declarations(变量声明):如var fo...
2019-12-01 22:50:30
124
原创 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
133
原创 JS预编译 只定义 不进行 = 运算
预编译过程没有 = 的运算let obj = { a:'sssss', b:(function(){ console.log(this.obj) return this })() }
2019-12-01 22:10:02
176
原创 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
452
原创 模拟事件监听 触发 移除 + 模块化 +数组 扁平化
<!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
239
原创 获取数组里的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
239
原创 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
249
原创 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
500
转载 flex align-items aling-content
align-items 每一个item 在当前轴的交叉轴垂直居中align-content 整个 flex容器 在当前 轴的交叉轴垂直居中转载 https://blog.youkuaiyun.com/cc18868876837/article/details/88138057...
2019-11-29 22:47:50
164
原创 双向绑定-原生
<!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
146
原创 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
195
原创 数组取倒数几个元素形成一个新的数组 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
1462
原创 媒体查询
<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
81
原创 选择器 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
1268
原创 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
236
原创 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
205
原创 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
182
原创 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
780
原创 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
1599
原创 css + 比较复杂的css选择器
1.多个not连用形成且条件多个not table tr td:not(:first-child):not(:last-child){ color:red; }
2019-11-12 17:26:53
335
原创 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
145
原创 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
479
原创 css 之 viewport
1.布局视口2.视觉视口3.理想视口布局视口是开发者布局使用的宽度视觉视口是可见宽度在移动端 一般视觉视口小于布局视口,为了能在手机上完美展示页面,让布局视口和视觉视口相同就是解决办法...
2019-11-02 09:41:50
259
原创 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
198
原创 浏览器常用宽高
pageX pageY 到html,body最左侧和最顶部的距离,而不是可视的宽高。html,body{w2000,h2000}此时的pageX 和 pageY 达到了 2014 2010滚动条已经到达最顶端clientX clientYclientX clientY 只能达到1670左右,说明相对浏览器可视宽度offsetX offsetY ???...
2019-11-01 16:54:23
362
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人