js相关小技巧
1.清空type=file的input文件上传控件的内容,相当于重置。txtFile是该input的id
$("#txtFile").val("");
$("#txtFile").attr("title","");
$("#txtFile").parent().find("input[type=text]").val("");
2.判断某个对象是否是数组
function isArray(obj){
return Object.prototype.toString.call(obj)=='[object Array]'
}
3.数组去重
function unique(arr){
return Array.from(new Set(arr));
}
4.变量转换(最快捷的)
var PI="3.14";
var sPI=PI+""; //变为字符串
var intPI=~~PI; //变为int
var floatPI=*PI;//变为float
var bPI=!!PI; //变为boolean型 (任何不为空的字符串和不为0的整数都是true)
var aPI=[PI]; //变为数组 转换日期和正则表达式尽量用构造函数
转换日期:
var date=new Date("2017-01-01 12:30:30.824"); 正则表达式:
var reg=new RegExp(/pattern/flags);
5.十六进制、八进制和科学计数法
var hex=0xFF;//十六进制表示法 (十进制的值是255)
var octal=; //八进制表示法 (十进制的值是16)
var dec=1e3;//十进制的科学计数法 (十进制的值是1000)
var dec2=().toExponential();//将十进制转换成科学技术法 1e3
6.判断属性是否存在,最好用 对象.属性 的方式判断
//如果存在全局变量property
if(window.property){ }else{ }
7.在创建对象时,返回当前对象的函数便于链式操作
function Person(name){
this.name=name;
this.changeName=function(name){
this.name=name;
return this;
}
this.sayHello=function(){
alert(`hello, ${this.name}!`);
return this;
}
}
var person=new Person("小强");
person.sayHello().changeName("小明").sayHello();
8.使用replace方法时,用正则表达式匹配需要被替换的字符串,并用函数返回的值去替换该字符串。
var h={H:"Hello",W:"world"};
var hello="H, W!";
//第一种写法
//如果正则表达式中没有圆括号(),传入函数的参数有两个。word代表整个被正则表达式匹配的字符串,index代表该匹配的字符串(word)在整个字符串中的索引
hello=hello.replace(/\w/g,function(word,index){
word=h[word];
//一定要返回一个字符串 去替换 被匹配的字符串,不然就会返回undefined字符串去替换被匹配的字符串。因为如果没有写renturn的话,函数会自动返回一个undefined值。
return word;
});
//第二种写法
//如果正则表达式中有圆括号(),传入函数的参数有三个。word代表整个被正则表达式匹配的字符串,element代表圆括号()中被匹配的字符串,index代表word在整个字符串中的索引
hello=hello.replace(/(\w)/g,function(word,element,index){
word=h[element];
return word;
})
alert(hello);//Hello, world!
9.十进制转换为十六进制或八进制,也可以反转过来
var int=;
var hex=int.toString();//结果:a (转换为16进制,结果类型是字符串)
hex=parseInt(hex,);//结果:10 (将16进制类型的字符串 转换为十进制的整数) var octal=int.toString();//结果:12 (同理)
octal=parseInt(octal,);//结果:10
10.更快的取整,使用双波浪线~~操作符
var int=(~~30.12);//
int=(~~-30.483);//-30
int=(~~0.5132);//
int=(~~NaN);//0 注意:如果执行失败,则返回0
int=(~~undefined);//
int=(~~null);//
11.字符串模版
//ES6新增了一种将变量组合为字符串的方法,使用${变量}的形式。
//注意,这种使用方式需要在``中使用。`字符是左上方,数字键盘1左边的那个,ESC键下面的那个键。现目前,支持ES6的浏览器都可以这样使用字符串模版方式。
var name="小明";
var age=;
var str=`${name}已经${age}岁啦!`;
alert(str);//小明已经21岁啦!
12.让div的滚动条始终保持在底部
//im-list是一个div的class,该div的overflow样式设置为auto
$(".im-list").scrollTop($(".im-list")[].scrollHeight);
13.console.log打印出不一样的文本
//console.log可以像C语言一样格式化输出
console.log("%c%s", "color: red; background: yellow; font-size: 24px; font-weight: bold;", "\u6253\u5370\u6548\u679c!")
打印结果:

js相关小技巧的更多相关文章
- JS、JQ相关小技巧积攒
JS.JQ相关小技巧积攒,以备不时之需. 1.js 获取时间差:时间戳相减.new Date().getTime() 获得毫秒数,除以(1000*60*60*24) 获得天数. 2.重定向操作:页面 ...
- JS处理事件小技巧
今天,就分享一下我自己总结的一些JS的小技巧: ①防止鼠标选中事件 <div class="mask" onselectstart="return false&qu ...
- Node.js 调试小技巧
小技巧--使用 supervisor如果你有 PHP 开发经验,会习惯在修改 PHP 脚本后直接刷新浏览器以观察结果,而你在开发 Node.js 实现的 HTTP 应用时会发现,无论你修改了代码的哪一 ...
- 一些js的小技巧
这里收集了一些编码上的小技巧,大家可以学习学习. 1.浮点转整型 使用|0快速转换 var a=(12.002)|0;//12 使用~~快速转换 ~取反运算符,2=0010,~2=1101,因为第一位 ...
- Js的小技巧
感谢好友破狼提供的这篇好文章,也感谢写这些知识点的作者们和将他们整理到一起的作者.这是github上的一篇文章,在这里本兽也就只做翻译,由于本兽英语水平和编程能力都不咋地,如有不好的地方也请多理解体谅 ...
- js 一些小技巧
Javascript 中的 绑定事件 on $(document).on("事件","元素","方法"): Js 定时方法 1.setTim ...
- JS firebug小技巧
实际上前端的发展与进步也离不开浏览器的支持,而对于开发者来讲,浏览器最好的支持,就是对于debug的良好支持,甚至在某些兴许接手的项目中,前端的debug甚至能够解决好多问题--不说了,都是泪啊!还是 ...
- Form 表单相关小技巧
JS ---textarea 高度自适应 var realH = this.scrollHeight + 10+ "px"; $(this).css("height&qu ...
- sublime相关小技巧
1.快速建立一个新文件:Ctrl+n 2.修改多个相同符号:Ctrl+D 3.建立语言后缀的文件保存,例如我想创建PHP的语言脚本,先按Ctrl+Shift+p,打开Command Palette,输 ...
随机推荐
- WannaflyCamp 平衡二叉树(DP)题解
链接:https://www.nowcoder.com/acm/contest/202/F来源:牛客网 题目描述 平衡二叉树,顾名思义就是一棵“平衡”的二叉树.在这道题中,“平衡”的定义为,对于树中任 ...
- 51nod 1428 活动安排问题 (贪心+优先队列)
来源:http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1428 首先按照开始时间从小到大排序. 其实只要维护一个结束时间的最 ...
- Luogu 2671 求和 NOIP2015T3
题目链接 题解 20pts $O(n^3)$枚举$x,y,z$,根据题目要求判断 40pts $O(n^2)$枚举$x,z$,需要满足$x,z$奇偶相同 20~40pts的代码我都没有写过...就不贴 ...
- BZOJ2662: [BeiJing wc2012]冻结 spfa+分层图
Description “我要成为魔法少女!” “那么,以灵魂为代价,你希望得到什么?” “我要将有关魔法和奇迹的一切,封印于卡片之中„„” 在这个愿望被实现以后的世界里,人们享 ...
- diff详解,读懂diff结果-转载
阅读目录 1.概述 2.diff如何工作,如何理解diff的执行结果 3.Normal模式 4.Context模式 5.Unified模式 6.比较目录 7.一些有用的参数 回到顶部 1.概述 本文将 ...
- MongoDB(课时30 $group)
3.7.5.聚合框架(核心) MapReduce功能强大,但是它的复杂度和功能一样强大,那么我们需要MapReduce的功能,使用聚合框架中的聚合函数:aggregate(). 3.7.5.1.gro ...
- C/C++UNION中包含STRUCT
测试环境:Win7x64,cn_visual_studio_2010_ultimate_x86_dvd_532347.iso,qt-opensource-windows-x86-msvc2010_op ...
- 使用自定义RadioButton和ViewPager实现TabHost效果和带滑动的页卡效果
在工作中又很多需求都不是android系统自带的控件可以达到效果的,内置的TabHost就是,只能达到简单的效果 ,所以这个时候就要自定义控件来达到效果:这个效果就是: 使用自定义RadioButto ...
- Spring源码的编译、下载和阅读
原文出处: 分享牛 想对spring框架进行深入的学习一下,看看源代码,提升和沉淀下自己,工欲善其事必先利其器,还是先搭建环境吧. 环境搭建 sping源码之前是svn管理,现在已经迁移到了githu ...
- 雷林鹏分享:Ruby 变量
Ruby 变量 变量是持有可被任何程序使用的任何数据的存储位置. Ruby 支持五种类型的变量.您已经在前面的章节中大概了解了这些变量,本章节将为您详细讲解这五种类型的变量. Ruby 全局变量 全局 ...