toFixed()
定义和用法
toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。
语法
NumberObject.toFixed(num)| 参数 | 描述 |
|---|---|
| num | 必需。规定小数的位数，是 0 ~ 20 之间的值，包括 0 和 20，有些实现可以支持更大的数值范围。如果省略了该参数，将用 0 代替。 |
replace()
定义和用法
replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
语法
stringObject.replace(regexp/substr,replacement)| 参数 | 描述 |
|---|---|
| regexp/substr | 必需。规定子字符串或要替换的模式的 RegExp 对象。 请注意，如果该值是一个字符串，则将它作为要检索的直接量文本模式，而不是首先被转换为 RegExp 对象。 |
| replacement | 必需。一个字符串值。规定了替换文本或生成替换文本的函数。 |
split()
定义和用法
split() 方法用于把一个字符串分割成字符串数组。
语法
stringObject.split(separator,howmany)| 参数 | 描述 |
|---|---|
| separator | 必需。字符串或正则表达式，从该参数指定的地方分割 stringObject。 |
| howmany | 可选。该参数可指定返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果没有设置该参数，整个字符串都会被分割，不考虑它的长度。 |
关闭所有页面跳转到指定页面（无法返回上一级页面）
wx.reLaunch({
url: ''
})web-view 的使用：
先登录小程序开发平台，将页面需要跳转的域名写上去，注意了，域名不是指服务器的域名，而是服务器下面的
业务域名。
<web-view src="myUrl"></web-view>这样我们就可以在小程序里面直接调用H5页面了。
小程序分享：
onShareAppMessage:function(){
return {
title:'转发标题（小程序标题）',
desc:'自定义标题',
path:'页面路径'
}
}具体的需要去看AIP 哪里有更详细的讲解
让文字显示两行然后超出部分用“...”代替 的CSS 样式
用的是 -webkit-私有属性：
多行
view {text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
多行
view{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;}
单行
view{overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}渐变
/* 旧语法，带前缀并且已经废弃，以支持老版本的浏览器 */
background: -prefix-linear-gradient(left, blue, white);
/* 新语法，不带前缀，以支持标准兼容的浏览器（Opera 12.1， IE 10， Firefox 16， Chrome 26， Safari 6.1） */
background: linear-gradient(to right, blue, white);scroll-view隐藏滚动条方法
::-webkit-scrollbar {
width: 0;
height: 0;
color: transparent;
}小程序获取上一个页面的栈
const wxCurrPage = getCurrentPages(); //获取当前页面的页面栈
const wxPrevPage = wxCurrPage[wxCurrPage.length - 2]; //获取上级页面的page对象0.5像素边框
.border{
position: relative;
}
.border:before{
content: '';
position: absolute;
width: 200%;
height: 200%;
border: 1px solid red;
transform-origin: 0 0;
transform: scale(0.5, 0.5);
box-sizing: border-box;
}吸顶样式 （ios 兼容-Android 目前版本兼容性较差）
position: sticky;/**吸顶*/
position: -webkit-sticky;阻止滑动
catchtouchmove="true"ES6数组排序
let time_list = ["2018-09-23", "2018-10-18", "2018-10-19", "2018-10-27", "2018-10-21", "2018-10-22", "2018-10-24", "2018-10-25", "2018-10-26", "2018-10-23"]
let qsort = fn => ([x, ...xn]) => x == null ? [] :
[
...qsort(fn)(xn.filter(a => fn(a, x))),
x,
...qsort(fn)(xn.filter(a => !fn(a, x)))
]
let tt = qsort((a, b) => a < b)(time_list) 自定义升降序，冒泡排序写法
function swap(arr, indexA, indexB) {
var temp;
temp = arr[indexA];
arr[indexA] = arr[indexB];
arr[indexB] = temp;
}
function bubbleSort(arr, compareFunc) {
for (let i = arr.length - 1; i > 0; i--) {
for (let j = 0; j < i; j++) {
if (compareFunc(arr[j], arr[j + 1]) > 0) {
swap(arr, j, j + 1);
}
}
}
return arr;
}
var arr = [91, 60, 96, 7, 35, 65, 10, 65, 9, 30, 20, 31, 77, 81, 24];
console.log(bubbleSort(arr, (a, b) => a - b));
console.log(bubbleSort(arr, (a, b) => b - a));ES6数组去重
let arr = [1,'1',1,1,2,'2','1',12,12,23,21,21]
//new Set(arr) 去重，Array.from() 把类数组对象、可迭代对象转化为数组。
let arr1 = Array.from(new Set(arr))
1.可以输入汉字，空格自动回退
onkeyup="this.value=this.value.replace(/(^\s+)|(\s+$)/g,'');"2.不可点击空格，汉字都不能打
onkeyup="this.value=this.value.replace(/[^\w]/g,'');"3.CSS禁止元素的target事件
//禁止
$('.coverup-btn').css("pointer-events","none");
//恢复
$('.coverup-btn').css("pointer-events","auto");4.select遍历赋值
let coun = $('#county')[0];//获取元素
for(var i=0;i<coun.options.length;i++){
if($(coun.options[i]).val() == '获取到的值'){
coun.options[i].selected=true;
break;
}
}数组内对象按时间排序算法
var jsonArr = [
{date : "2017-8-3 13:50:56" , key:"XX"},
{date : "2017-8-2 11:50:56" , key:"XX"},
{date : "2017-7-5 13:52:56" , key:"XX"},
{date : "2017-11-3 13:50:56" , key:"XX"},
{date : "2017-2-3 12:50:56" , key:"XX"},
{date : "2017-8-3 14:58:56" , key:"XX"}
];
//排序
jsonArr.sort(function(a,b){
if(typeof(a) == "object" && typeof(b) == "object"){
return new Date (a['date']).getTime() > new Date (b['date']).getTime() ? 1 : -1; //正序
//return new Date (a['date']).getTime() > new Date (b['date']).getTime() ? -1 : 1; //倒叙 ,
}
});
console.log(jsonArr);vue 禁止鼠标右键方法
在组件元素上 添加 @contextmenu.prevent 方法
例如：
<template>
<div class="details" @contextmenu.prevent>
</div>
</template>vue 禁止页面全选、选择复制
/*禁止页面选择*/
.details{
user-select:none;
}vue 全局禁止 复制和右键功能
mounted(){
document.oncontextmenu = function(){
return false;
}
document.onselectstart = function(){
return false;
}
}文字选中后的背景颜色
::selection {
color: white;
background: purple;
}grid-template设置网格模板，实现三列两行布局
display:grid;
grid-template:70px 100px / 100px aoto 100px;
查看网页布局
javascript: (function(){ var style = document.querySelector('#_outline_'); if (style) { style.parentNode.removeChild(style); } else { style = document.createElement('style'); style.id = '_outline_'; style.innerHTML = "*{outline: 1px solid red}"; document.body.appendChild(style); } })();把上面的这段代码赋值到标签页
字符串转数字互相转换
//--------------------字符串转数字---------------------------
var s = "234";
//1、纯数字转换
//1 字符串在运算操作中会被当做数字类型来处理
s *= 1;
//2 字符前加“+”
console.log(+s);
//3 string的两个转换函数，只对string有效
parseInt(s); // 234
parseFloat(s); //234
//4 强制类型转换
Number(s); // 234
//2、数字加字母等非数字转换
var s = '234string';
parseInt(s); //234
parseFloat(s); //234.0
//--------------------数字转换字符串---------------------------
var num=123123;
//1、toString()
console.log(num.toString());
//2、数字+任何字符串""
console.log(num+"");
// 关于字符串
//判断是否包含某个字符串 包含返回下标 不包含返回-1
var i = str.indexOf("x")
//最后一次下标的字符串的字符串
var i = str .lastIndexOf("")
//转化大小写
str.toUpperCase() //转大写
str.tolowerCase()// 转小写
//截取字符串 字符串.substr（"从哪开始","截取几个"）
str.substr(0,5)CSS话邮票锯齿边框
.vote-box{
height:329px;
margin: 15px 15px 30px;
background-image: radial-gradient(transparent 0, transparent 6px, #fff 6px);
background-size: 20px 20px;
background-position: 3px 18px;
position: relative;
&:before {//使用伪元素遮盖
content: ' ';
display: block;
background-color: #fff;
position: absolute;
top: 0;
bottom: 7px;
left: 0;
right: 0;
}
}验证input 只能输入数字和字母
let reg = /^[A-Za-z0-9]{1,30}$/;
if(reg.test(e.target.value)){
this.form.id_no = e.target.value;
}ES6 校验字符串是否包含某个值
includes()：是否包含了参数字符串，返回布尔值
startsWith()：参数字符串是否在原字符串的头部，返回布尔值
endsWith()：参数字符串是否在原字符串的尾部，返回布尔值禁止遮罩层下层列表滚动
//小程序
catchtouchmove="preventTouchMove"
//vue
@touchmove.prevent判断对象中是否存在某个值
let obj = {a:'李莉萨',b:2}
console.log(obj.hasOwnProperty(a)) //true
console.log(obj.hasOwnProperty(c)) //false
字体缩放
-webkit-transform: scale(0.8,1.5);
-moz-transform: scale(0.8,1.5);
-o-transform: scale(0.8,15);
transform: scale(0.8,1.5);
数组内对象去重：
let person = [
{id: 0, name: "小明"},
{id: 1, name: "小张"},
{id: 2, name: "小李"},
{id: 3, name: "小孙"},
{id: 1, name: "小周"},
{id: 2, name: "小陈"},
];
let obj = {};
let peon = person.reduce((cur,next,index,arr) => {
console.log(cur,next,index,arr)
obj[next.id] ? "" : obj[next.id] = true && cur.push(next);
return cur;
},[]) //设置cur默认类型为数组，并且初始值为空的数组
console.log(peon);input 禁止输入特殊字符
el.oninput = (e) => {
// const pattern = new RegExp("[`~!@#$%^&*……()=|{}':;',\\[\\].<>/?~！@#￥%……&*（）——|{}【】‘；：”“'。，、？]")
// e.target.value = e.target.value.replace(pattern,'');
const pattern = new RegExp(/(^[`~%!@#$^=''?~！@#￥……&——_-‘”“'？*()（）{}【】，,。.、:：\\|/]+)|([`~%!@#^=''$?~！{}【】@#￥……&——_-‘”“'？*()（），,。.、:：\\|/]+$)/gi);
e.target.value = e.target.value.replace(pattern,'');
el.focus();
};彩虹字
.gradient-text {
color: transparent;
background: -webkit-linear-gradient(30deg, #32c5ff 25%, #b620e0 50%, #f7b500 75%, #20e050 100%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: auto;
}
@keyframes gradientText {
0% {
background-position: 0;
}
100% {
background-position: 28000px;
}
}
.gradient-text {
animation: gradientText 300s infinite linear;
-webkit-animation: gradientText 300s infinite linear;
}持续更新中~~~ 望大家多提意见！
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
