ManGe总结的常用js方法

字符串操作

length 属性返回字符串的长度； str.length;
indexOf() 方法返回字符串中指定文本首次出现的索引（位置）； str.indexOf(“China”);
lastIndexOf() 方法返回指定文本在字符串中最后一次出现的索引; str.lastIndexOf(“China”);
search() 方法搜索特定值的字符串，并返回匹配的位置; str.search(“locate”);
slice() 提取字符串的某个部分并在新字符串中返回被提取的部分; str.slice(7,13);
substring() 类似于 slice()。不同之处在于 substring() 无法接受负的索引。
substr() 类似于 slice()。不同之处在于第二个参数规定被提取部分的长度。
replace() 方法用另一个值替换在字符串中指定的值; str.replace(“a”, “b”);
toUpperCase() 把字符串转换为大写; str.toUpperCase();
toLowerCase() 把字符串转换为小写; str.toLowerCase();
concat() 连接两个或多个字符串; str1.concat(" ",str2);
trim() 方法删除字符串两端的空白符; str.trim();
charAt() 方法返回字符串中指定下标（位置）的字符串; str.charAt(0);
charCodeAt() 方法返回字符串中指定索引的字符 unicode 编码; str.charCodeAt(0);
split() 将字符串转换为数组,分割字符串；txt.split(",");// 用逗号分隔

数字操作

toString() 以字符串返回数值； (123).toString();// 从文本 123 返回 123
toFixed() 返回字符串值，它包含了指定位数小数的数字(四舍五入);
toPrecision() 返回字符串值，它包含了指定长度的数字(四舍五入);
Number() 转换为number类型； Number(x);
parseInt() 解析一段字符串并返回整型;
parseFloat() 解析一段字符串并返回浮点型;

数组操作

toString() 把数组转换为数组值（逗号分隔）的字符串； arry.toString();
join() 拼接数组为字符串； arry.join("");
pop() 方法从数组中删除最后一个元素;
push() 方法（在数组结尾处）向数组添加一个新的元素;
shift() 方法会删除第一个元素;
unshift() 方法在头向数组添加新元素;
delete 运算符来删除; delete fruits[0]; // 把 fruits 中的首个元素改为 undefined;
concat() 合并两个数组;
slice() 方法用数组的某个片段切出新数组;
reverse() 将数组中的元素进行反转，倒序显示
sort() 将数组元素进行排序

json

eval(’(’ + str + ‘)’); 字符串转json对象
JSON.parse(str); 字符串转json对象
JSON.stringify(jsonobj); json对象转换成字符串
str.parseJSON(); 字符串转换为JSON对象

字典

var dic = new Array();//通过申明一个Array来做一个字典
dic[“q”] = “q1”;//设置和修改值
for (var key in dic) {console.log(key + “:” + dic[key]);} //遍历
delete dic.q; delete dic[“q”]; 删除一个值

聊天的时间显示

// =============  自定义时间处理
// @ timestamp    时间戳
dateDiff:function(timestamp){//console.log(timestamp);if (timestamp == 0){return "未聊天";}// 补全为13位var arrTimestamp = (timestamp + '').split('');for (var start = 0; start < 13; start++) {if (!arrTimestamp[start]) {arrTimestamp[start] = '0';}}timestamp = arrTimestamp.join('') * 1;var minute = 1000 * 60;var hour = minute * 60;var day = hour * 24;var halfamonth = day * 15;var month = day * 30;var now = new Date().getTime();var diffValue = now - timestamp;// 如果本地时间反而小于变量时间if (diffValue < 0) {return '不久前';}// 计算差异时间的量级var monthC = diffValue / month;var weekC = diffValue / (7 * day);var dayC = diffValue / day;var hourC = diffValue / hour;var minC = diffValue / minute;// 数值补0方法var zero = function (value) {if (value < 10) {return '0' + value;}return value;};if (monthC > 12) {// 超过1年，直接显示年月日return (function () {var date = new Date(timestamp);return date.getFullYear() + '年' + zero(date.getMonth() + 1) + '月' + zero(date.getDate()) + '日';})();} else if (monthC >= 1) {return parseInt(monthC) + "月前";} else if (weekC >= 1) {return parseInt(weekC) + "周前";} else if (dayC >= 1) {return parseInt(dayC) + "天前";} else if (hourC >= 1) {return parseInt(hourC) + "小时前";} else if (minC >= 1) {return parseInt(minC) + "分钟前";}return '刚刚';},

时间戳转时间字符串

 // =============  时间戳转时间字符串// @ timestamp   时间戳timestampToTime:function(timestamp) {var time = new Date(timestamp)var year = time.getFullYear()const month = (time.getMonth() + 1).toString().padStart(2, '0')const date = (time.getDate()).toString().padStart(2, '0')const hours = (time.getHours()).toString().padStart(2, '0')const minute = (time.getMinutes()).toString().padStart(2, '0')const second = (time.getSeconds()).toString().padStart(2, '0')return year + '-' + month + '-' + date + ' ' + hours + ':' + minute + ':' + second},

正则判断是否发送有效消息

//发送消息var msg =  $(".inputmsg").html();msg = msg.replace(/&nbsp;/ig," ");if (msg.length <1){t.$toast("无法发送空消息");return;}if (msg.match(/^[ ]*$/)){t.$toast("无法发送没有内容的消息");return;}if (msg.match(/^[\\n]*$/)){t.$toast("无法发送没有内容的消息");return;}

发送图片并获取宽高

$("#imgfile").change(function(evt){//console.log("sendimg");// 如果浏览器不支持FileReader，则不处理if (!window.FileReader){return};var f = event.target.files[0];if (f == undefined){return;}if (f.name == ""){return;}var fileReader = new FileReader();fileReader.readAsDataURL(f);fileReader.onload = function(e) {console.log(this.result,'this.result');var base64 = this.result;var img = new Image();img.src = base64;img.onload = function() {this.imgInfo = {width: img.naturalWidth,height: img.naturalHeight};console.log(img,"宽：" + img.naturalWidth + " 高：" + img.naturalHeight);var formdata=new FormData();formdata.append('file',f);//console.log(formdata);$.ajax({....

页面刷新,离开,事件处理


<body class="antialiased" onbeforeunload="checkLeave()">function checkLeave(e){console.log("是否刷新界面，刷新界面弹哪个框");//event.returnValue=false;//doing...e = e || window.event;if (e) {e.returnValue = "您是否确认离开此页面-您输入的数据可能不会被保存";}return "您是否确认离开此页面-您输入的数据可能不会被保存";
}

window.onbeforeunload = (event) => {//doing...event.returnValue = "离开此网站不会保存您所做的更改";};

发送输入框粘贴事件的处理

$(".inputmsg").on('paste',function(e){var e = event || window.event// 阻止默认粘贴e.preventDefault();pastedText = undefined;// 兼容IEif(window.clipboardData && window.clipboardData.getData) {// 获取拷贝进剪切板指定格式的数据 (此处用的Text格式)pastedText = window.clipboardData.getData('Text');      } else if((e.clipboardData || e.originalEvent.clipboardData) && (e.clipboardData || e.originalEvent.clipboardData).getData) {pastedText = (e.originalEvent || e).clipboardData.getData('text/plain')}console.log(pastedText);$(".inputmsg").append(pastedText);
});

返回顶部通用方法

function backTop(btnId) {var btn = document.getElementById(btnId);var d = document.documentElement;var b = document.body;window.onscroll = set;btn.style.display = "none";btn.onclick = function () {btn.style.display = "none";window.onscroll = null;this.timer = setInterval(function () {d.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1);b.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1);if (d.scrollTop + b.scrollTop == 0)clearInterval(btn.timer, (window.onscroll = set));}, 10);};function set() {btn.style.display = d.scrollTop + b.scrollTop > 100 ? "block" : "none";}
}
backTop("goTop");

求滚动条的滚动距离

function getScrollOffset() {if (window.pageOffset) {return {x: window.pageXOffset,y: window.pageYOffset}} else {return {x: document.body.scrollLeft + document.documentElement.scrollLeft,y: document.body.scrollTop + document.documentElement.scrollTop}}
}

当前时间的年月日

function getDate() {var date = new Date();var Year = date.getFullYear();var month = date.getMonth();var Date1 = date.getDate();var Hours = date.getHours();var minutes = date.getMinutes();var secod = date.getSeconds();return Year + "年" + (month + 1) + '月' + Date1 + '日' + Hours + '时' + minutes + '分' + (secod + 1) + '秒';
}

数组去重

function () {var obj = {},arr1 = []; //返回新的数组for (var i = 0; i < this.length; i++) {if (!obj[this[i]]) {               //obj没有值的话，undefined 取反说明已经有值obj[this[i]] = 'abc';arr1.push(this[i]);}}return arr1;
}

返回浏览器的视口尺寸

function getViewprotOffset() {if (window.innerWidth) {return {w: window.innerWidth,y: window.innerHeight}} else {if (document.compatMode == "BackCompat") {return { w: document.body.clientWidth,h: document.body.clientHeight}} else {return {w: document.documentElement.clientWidth,h: document.documentElement.clientHeight}}}
}

将日期格式转换成时间戳


function timeToTimestamp(time) {var date = new Date('2014-04-23 18:55:49:123');// 有三种方式获取var time1 = date.getTime();var time2 = date.valueOf();var time3 = Date.parse(date);console.log(time1);//1398250549123console.log(time2);//1398250549123console.log(time3);//1398250549000
}

手机号码正则表达式验证


function checkPhone(){ var phone = document.getElementById('phone').value;if(!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(phone))){ alert("手机号码有误，请重填");  return false; }
}

随机颜色

function randomColor(){var col="#";for(var i=0;i<6;i++){col+=this.randoms(16).toString(16);}return col;}

获取浏览器的名称以及版本

function getBrowserRV(){var str=navigator.userAgent;// 判断是否是Chromeif(str.indexOf("Chrome")>-1){var index=str.indexOf("Chrome");return str.slice(index,str.indexOf(" ",index+1)).split("/");}// 判断是否是Firefoxif(str.indexOf("Firefox")>-1){var index=str.indexOf("Firefox");return str.slice(index).split("/");}// 判断是否是IE11if(str.indexOf("rv:")>-1 && str.indexOf("Trident")>-1){return ["IE","11"];}// 判断是否是IE10及以下if(str.indexOf("Trident")>-1){var index=str.indexOf("MSIE");return ["IE",str.slice(index,str.indexOf(";",index)).split(" ")[1]];}}

获取地址栏上的参数

function queryString(values){var arr = location.search.slice(1).split("&");arr = arr.map((item)=>({key:item.split("=")[0],value:item.split("=")[1]}));var str = arr.filter(({key})=>key == values);return str ? str[0].value : '';}

ManGe总结的常用js方法相关推荐

前端常用js方法工具封装
不定期更新 let util = {};/*** 获取指定数组指定key对应的值比较,若相等则返回该value值* @param arr Array 需要遍历的数组* @param id string ...
js字符串、数组处理方法、以及一些常用js方法
1.截取获得某字符串后面的字符: var i = id.substring(id.indexOf("+") + 1, id.length);//获取+后面的字符 2.截取量字符串之 ...
【JS】常用js方法
1.判断是否是数组.字符串等方法 a instanceof b a是你需要判断的数据 b是判断的类型 //直接判断原型 var a = [1,5,8] var b = '123456'console. ...
前端常用的工具方法，常用js方法
1.邮箱 export const isEmail = (s) => {return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2, ...
常用js方法集合，动态加载js方法--判断变量是否为空--截取小数点后几位--截取带中文的字条串...
/* * 动态加载外部js文件 */loadJS: function(url,id){if(typeof(id)=='undefined'){id = new Date().getTime();}va ...
js如何操作表格（常用属性方法汇总）
js如何操作表格(常用属性方法汇总) 一.总结一句话总结: 二.表格相关的属性和方法 1.1 Table 对象集合 cells[] 返回包含表格中所有单元格的一个数组. 语法:tableObject ...
项目开发中常用JS表单取值方法
项目开发中常用JS表单取值方法一.常用表单基本取值方法(form1为表单名称,TextBox1为控件ID,以文本框为例,html控件与web服务器控件是一样的) 1.form1.Te ...
JS常用属性方法大全
JS常用属性方法大全 1.输出语句:document.write(""); 2.JS中的注释为: 3.传统的HTML文档顺序是:document->html->(hea ...
concat合并的数组会有顺序么_超全的JS常用数组方法整理
前言常用数组方法汇总方法解析 1:concat(); 2:join(); 3:pop(); 4:shift(); 5:unshift(); 7:reverse(); 8:sort(); 9:sli ...

ManGe总结的常用js方法

字符串操作

数字操作

数组操作

json

字典

聊天的时间显示

时间戳转时间字符串

正则判断是否发送有效消息

发送图片并获取宽高

页面刷新,离开,事件处理

发送输入框粘贴事件的处理

返回顶部通用方法

求滚动条的滚动距离

当前时间的年月日

数组去重

返回浏览器的视口尺寸

将日期格式转换成时间戳

手机号码正则表达式验证

随机颜色

获取浏览器的名称以及版本

获取地址栏上的参数

ManGe总结的常用js方法相关推荐

最新文章

热门文章

ManGe总结的常用js方法

字符串操作

数字操作

数组操作

json

字典

聊天的时间显示

时间戳转时间字符串

正则判断是否发送有效消息

发送图片并获取宽高

页面刷新,离开,事件处理

发送输入框 粘贴事件的处理

返回顶部通用方法

求滚动条的滚动距离

当前时间的年月日

数组去重

返回浏览器的视口尺寸

将日期格式转换成时间戳

手机号码正则表达式验证

随机颜色

获取浏览器的名称以及版本

获取地址栏上的参数

ManGe总结的常用js方法相关推荐

最新文章

热门文章

发送输入框粘贴事件的处理