15个非常实用的JavaScript代码片段


Posted in Javascript onDecember 18, 2016

本文实例为大家分享了非常实用的js片段,供大家参考,具体内容如下

1.如何区分IE及非IE浏览器:

if(!+[1,]){ //IE 11 不支持
alert("这是 IE 浏览器");
}else{
alert("这不是 IE 浏览器");
}

2.将日期直接转换为数值:

+new Date();

3.非IE浏览器下将类数组对象 “arguments”转为数组:

Array.prototype.slice.call(arguments);

4.最简单的选择运算符||:

var a = 0 || 3;
console.log(a); //结果3

如果=后面的第一个值计算结果为布尔值“真”,则 a 的值取第 1 个,否则取第 2 个。

5.单链式运算(如 a++ -1):

var a=10;
console.log(a++ -1);

先执行“a-1”,再执行“a=a+1”。

6.有趣的void操作符:

<a href="javascript:void(0)">我是一个死链接</a>

void是一种操作符,用来计算一个表达式但不返回值。

7.跳转至新页面,并且保证浏览器不会再回退:

location.replace("https://3water.com");

location 的 replace() 方法可以用一个新的文档替换当前文档,并且该方法还会覆盖 History 对象中的记录。

8.几秒钟之后返回上一页:

<meta http-equiv="refresh" content="3;url=javascript:window.history.go(-1);">

9.在打开的子窗口中刷新父窗口:

window.opener.location.reload();

10.验证是否为负数的正则表达式:

/^-\d+$/.test(str);

11.用JavaScript打印页面:

window.print()

12.显示/隐藏一个DOM元素:

el.style.display = "";
el.style.display = "none"; //el是待操作的DOM元素

DOM元素的显示/隐藏主要是通过设置元素的样式display属性来实现。

13.实现alert()中的文本换行:

alert("p\np")

"\n"代表换行符。

14.实现ECMAScript5中的Object.create()函数: 

function clone(proto){
function _clone(){}
_clone.prototype = proto;
_clone.prototype.constructor = _clone;
return new_clone(); //等价于 Object.create(Person);
var me = clone(Person);

用原型链形式继承,构造函数重新指向新创建的对象。

15.理解JavaScript中的闭包:

例如,以下代码会输出5次,结果都是5,那么如何输出0、1、2、3、4?

for(var i = 0; i < 5; i++) {
setTimeout(function() {
console.log(i);
}, 1000);
}

利用闭包的原理实现,代码如下:

for(var i = 0; i < 5; i++) {
(function(e) {
setTimeout(function() {
console.log(e);
}, 1000);
})(i);
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 日历提醒系统( 兼容所有浏览器 )
Apr 07 Javascript
jquery中输入验证中一个不错的效果
Aug 21 Javascript
jQuery DOM操作实例
Mar 05 Javascript
JS自定义选项卡函数及用法实例分析
Sep 02 Javascript
如何动态加载外部Javascript文件
Dec 02 Javascript
jquery心形点赞关注效果的简单实现
Nov 14 Javascript
js时间戳格式化成日期格式的多种方法介绍
Feb 16 Javascript
Mint UI实现A-Z字母排序的城市选择列表
Dec 28 Javascript
layui table去掉右侧滑动条的实现方法
Sep 05 Javascript
构建大型 Vue.js 项目的10条建议(小结)
Nov 14 Javascript
JS面向对象编程——ES6 中class的继承用法详解
Mar 03 Javascript
Node.js API详解之 repl模块用法实例分析
May 25 Javascript
scroll事件实现监控滚动条并分页显示(zepto.js)
Dec 18 #Javascript
简单实现node.js图片上传
Dec 18 #Javascript
Javascript计算二维数组重复值示例代码
Dec 18 #Javascript
Jquery Easyui选项卡组件Tab使用详解(10)
Dec 18 #Javascript
Jquery Easyui菜单组件Menu使用详解(15)
Dec 18 #Javascript
node.js请求HTTPS报错:UNABLE_TO_VERIFY_LEAF_SIGNATURE\的解决方法
Dec 18 #Javascript
Jquery Easyui分割按钮组件SplitButton使用详解(17)
Dec 18 #Javascript
You might like
thinkphp3.2实现跨控制器调用其他模块的方法
2017/03/14 PHP
PHP实现的策略模式简单示例
2017/08/25 PHP
Grid得到选择行数据的方法总结
2011/01/17 Javascript
javascript数组快速打乱重排的方法
2014/01/02 Javascript
jQuery中extend函数的实现原理详解
2015/02/03 Javascript
Node.js中JavaScript操作MySQL的常用方法整理
2016/03/01 Javascript
js canvas仿支付宝芝麻信用分仪表盘
2016/11/16 Javascript
纯原生js实现table表格的增删
2017/01/05 Javascript
vue-router跳转页面的方法
2017/02/09 Javascript
JavaScript与JQUERY获取元素的宽、高和位置
2017/02/26 Javascript
利用node实现一个批量重命名文件的函数
2017/12/21 Javascript
vue的style绑定background-image的方式和其他变量数据的区别详解
2018/09/03 Javascript
vue源码中的检测方法的实现
2019/09/26 Javascript
小程序选项卡以及swiper套用(跨页面)
2020/06/19 Javascript
Javascript前端下载后台传来的文件流代码实例
2020/08/18 Javascript
一起来了解一下JavaScript的预编译(小结)
2021/03/01 Javascript
python中map的基本用法示例
2018/09/10 Python
Python + selenium + requests实现12306全自动抢票及验证码破解加自动点击功能
2018/11/23 Python
python实现邮件发送功能
2019/08/10 Python
django使用channels实现通信的示例
2020/10/19 Python
CSS3中的弹性布局em运用入门详解 1em等于多少像素
2021/02/08 HTML / CSS
canvas绘制视频封面的方法
2018/02/05 HTML / CSS
北欧最好的童装网上商店:Babyshop
2019/09/15 全球购物
前台接待岗位职责
2013/12/03 职场文书
大学毕业生自荐书怎么写?
2014/01/06 职场文书
写演讲稿所需要注意的4个条件
2014/01/09 职场文书
《望洞庭》教学反思
2014/02/16 职场文书
竞选生活委员演讲稿
2014/04/28 职场文书
担保书格式
2015/01/20 职场文书
2015年四年级班主任工作总结
2015/10/22 职场文书
志愿服务心得体会
2016/01/15 职场文书
少年的你:世界上没有如果,要在第一次就勇敢的反抗
2019/11/20 职场文书
redis哨兵常用命令和监控示例详解
2021/05/27 Redis
Python获取江苏疫情实时数据及爬虫分析
2021/08/02 Python
golang用type-switch判断interface的实际存储类型
2022/04/14 Golang
SpringBoot Http远程调用的方法
2022/08/14 Java/Android