CSS部分
盒子边倾斜
clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%);
禁止点击事件/鼠标事件“穿透”
div * { pointer-events: none; /*链接啊,点击事件啊,都没有效果了*/ }
用来控制元素在移动设备上使用滚动回弹效果
.main{ -webkit-overflow-scrolling: touch;}
可解决在IOS中使用overflow:auto 形成的滚动条,滚动不流畅的情况
文字渐变效果
.text-gradient{ background-image: linear-gradient(135deg, deeppink, deepskyblue); -webkit-background-clip: text; color: transparent;}
css三角形
#triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red;}
JS部分
JavaScript中检测数组的方法
(1)、typeof操作符
这种方法对一些常用的类型检查没有问题,但对array和null 都判断为object
(2)、instanceof操作符
这个操作符是检测对象的原型链是否指向构造函数的prototype对象的
(3)、对象的constructor属性
const arr = []console.log(arr.constructor === Array) // true
(4)、Object.prototype.toString
const arr = []console.log(Object.prototype.toString.call(arr) === '[object Array]') // true
(5)、Array.isArray()
常用的字符串操作
- 字符串转化toString()
- 字符串分隔split()
- 字符串替换replace()
- 获取长度length
- 查询子字符串 indexOf
- 返回指定位置的字符串或字符串编码 charAt charCodeAt
- 字符串匹配 match
- 字符串拼接concat
- 字符串的切割或提取slice() substring() substr()
- 字符串大小写转化 toLowerCase toUpperCase
- 字符串去空格 trim() 用来删除字符串前后的空格
其中第9中三者的区别如下:
(1)slice(), 参数可以是负数,负数表示从字符串最后一个位置开始切割到对应结束位置
(2)substring(),参数不可为负数,切割第一个位置到第二个位置的字符串
(3)substr(), 参数不可为负数,第一个参数是开始位置,第二个参数为切割的长度
字符串去重
const str = '11122223333'
const arr = str.split('')
const uniqueStr = [...new Set(arr)].join('')
常用的数组操作
1、Array.map()
此方法是将数组中的每个元素调用一个提供的函数,结果作为一个新的数组返回,并没有改变原来的数组
2、Array.forEach()
此方法是将数组中的每个元素执行传进提供的函数,没有返回值,注意和map方法区分
3、Array.filter()
此方法是将满足条件的元素作为一个新数组返回
4、Array.every()
此方法将数组所有元素进行判断返回一个布尔值,如果所有元素都符合判断条件,则返回true,否则返回false
5、Array.some()
此方法将数组所有元素进行判断返回一个布尔值,如果有一个元素满足判断条件,则返回true,所有元素都不满足则返回false
6、Array.reduce()
此方法为所有元素调用返回函数
7、Array.push()
在数组最后面添加新元素
8、Array.shift()
删除数组第一个元素
9、Array.pop()
删除数组最后一个元素
10、Array.unshift()
在数组最前面增加元素
11、Array.isArray()
判断是否为一个数组
12、Array.concat()
数组拼接
13、Array.toString()
数组转化为字符串
14、Array.join()
数组转化为字符串,并用第一个参数作为连接符
15、Array.splice(开始位置,删除个数,元素)