30段有用的javascript代码
1. 如何区分IE及非IE浏览器 if(!+[1,]){
console.log("这是IE浏览器");
} else{
console.log("这不是IE浏览器");
}
<script type="text/javascript">
alert([1,2]);//相当于alert([1,2].toString()); --这在IE与非IE上都相同,都会弹出"1,2"
alert([1,]);//相当于alert([1,].toString());--在非IE的标准浏览器上,js引擎会自动删除最后的",",所以在IE上会弹出"1,",而在非IE上会弹出"1"
alert(+[1,]);//根据上面的解释,这一句在IE上相当于alert(+"1,"),而在非IE上相当于alert(+"1"),正号的作用在于试图将字符串转换为数字,"1,"当然不是数字,而"1"可以转换为数字1,所以最终的结果:IE上会转换失败弹出"NaN",而非IE浏览器上会弹出数字"1" //上面的+号转换字符串为数字的测试
var s = +"5";
alert(s+1); //ok,到这里为止,我们知道 +[1,] 最终在IE为上NaN,在非IE浏览器上则为数字1 //下面再来看看很有个性的NaN
alert(NaN==true);//弹出 false
alert(NaN==false);//弹出 false
alert(NaN==NaN);//弹出 false //即NaN不管与谁比较都是false
alert(!NaN);//相当于alert(!(NaN==true)),根据上面的解释当然是弹出true //所以,alert(!+[1,]) 最终在IE上会弹出"true",下面再来看看firefox等非IE浏览器上的表现
alert(new Boolean(0));//false
alert(new Boolean(1));//true
alert(new Boolean(-1));//true
//即:数字0会转换为false,其它任何数字都会转换为true,所以最终在非IE浏览器上最终等效于:
alert(!1);
//即
alert(!true)//最终会得到false //综上所述:下面的这个判断就能判定浏览器是不是IE
if (!+[1,]){
alert("我是货真价实的IE浏览器!")
}
else{
alert("我不是IE!")
}
</script>
这个在IE6、7、8里运行是对的,但是在9、10、11里已经修复了,和其他modern浏览器显示效果是一样的,所以,这个使用时要做区分!
2. 将日期直接转换成数值
+new Date();
3. 非IE浏览器下将类数组对象'arguments'专为数组 Array.ptrototype.slice.call(arguments); arguments不是Array的实例,因此不是真正的数组,也就没有slice()方法,但为什么用"Array.prototype.slice"而不是"Array().slice"或"[].slice()"呢?因为这两种方法效率比较低,故使用代码中的写法访问Array的内置函数。
4. 最简单的运算符 var a = 0 || 3;
console.log(a); //结果3 如果=后面的第一个值计算结果为布尔值“真”,则a的值取第1个,否则取第2个。
5.单链式计算 var a = 10;
console.log(a++ -1); 先执行"a-1", 在执行"a = a+1"。
6. 有趣的void操作符 <a href="javascript:void(0)">我是个死链接</a> void是一种操作符,用来计算一个表达式但不返回值。用法: javascript:void(expression),expression是一个要计算的javascript标准表达式。
. 跳转至新页面,并且保证浏览器不会再回退
location.replace("url"); location的replace()方法可以用一个新的文档替换当前文档,并且该方法还会覆盖History对象中的记录。
8.几秒钟之后返回上一页
<meta htt-equiv="refresh" content="3, url=javascript:window.hostory.go(-1);"> 其中content为设置的时间
.在打开的子窗口中刷新父窗口
window.opener.location.reload();
10. 验证是否为负数的正则表达式
/^-\d+$/.test(str);
. 用javascript打印网页
window.print(); window.print()属于浏览器内置的API,可以直接打印页面
12. 显示/隐藏一个DOM元素
el.style.display = "";
el.style.display = "none"; DOM元素的显示/隐藏主要通过设置元素的样式display属性来实现。
. 实现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,如何输出1、2、3、4?
for(var i=0; i<5;i++) {
setTimeout(function(){
console.log(i);
},1000);
} //5次结果都是5
//利用闭包原理实现, 代码如下
for(var i=0; i<5;i++) {
(function(e) {
setTimeout(function(){
console.log(e);
},1000);
})(i)
} //5次结果都是0,1,2,3,4
16. 检测Shift、Alt、Ctrl键
//以下是浏览器内置的检测方法
event.shiftKey; //检测Shift
event.altKey; //检测Alt
event.ctrlKey; //检测Ctrl
.获取屏幕分辨率的宽、高
window.screen.height; //获取屏幕高度
window.screen.width; //获取屏幕宽度 window.screen这个对象包含了有关用户屏幕的信息
.脚本永不出错的方法
window.onerror = function(m, f, l){
return true;
};
.让javascript处理字符与ASCLL码之间的转换
console.log("a".charCodeAt(0)); //
console.log(String.fromCharCode(75)); //K charCodeAt()返回指定位置字符的Unicode编码; fromCharCode()接受一个指定的Unicode值,然后返回一个字符串。
20. 访问对象属性的代码
var demo = {name: "ki"} demo.name; //ki
demo['name']; //ki
//访问对象属性一般存在两种方式,通过","或 "[]"。 一般情况下两种方式等效,但是"[]"还可以动态设置属性。
var get = 'name';
demo[get]; //ki
21. 把一个值转化为布尔值的最简单方式
!!"demo" //true
!!"; //false
!!'0'; //true
!!'1'; //true
!!{}; //true
!!true; //true 使用"!"操作符两次,可以把一个值转化为布尔值
22. 判断浏览器是否支持HTML5
!!navigator.geolocation; 在HTML5中,navigator.geolocation可以获取设备的当前位置,通过"!"就可以判断是否支持此API,即是否支持HTML5。
23. 判断是否支持Canvas
function isCanvas() {
return !!document.createElement('canvas').getContext;
}
.判断IE版本
window.navgator.appVersion 上述代码返回一个字符串, 表示所使用浏览器的版本号。他可能只包含一个数字,比如5.0,还可能包含一些其它信息。
25. 声明变量的缩略写法与复杂写法
/*复杂写法*/
var x;
var y;
var z=3; /*缩略写法*/
var x, y, z=3; javascript是比较灵活的语言,编程时尽量使用缩略写法,这样会提高javascript性能。
26. 采取惰性载入的方案提高函数代码的性能
function addEvents(type, element, fun) {
if(element.addEventListener) {
element.addEventListener(type, fun, false);
}
else if(element.attachEvent) {
element.attachEvent('on' + type, fun);
}
else{
element['on'+tyoe] =fun;
}
} //所谓惰性载入就是在第一次执行代码后,用函数代码内部的方法覆盖原有代码,代码如下:
var addEvents = (function() {
if(element.addEventListener) {
element.addEventListener(type, fun, false);
}
else if(element.attachEvent) {
element.attachEvent('on' + type, fun);
}
else{
element['on'+tyoe] =fun;
}
})();
27. 捕捉Ctrl+Enter按键
if(event.ctrlKey && event,keyCode == 13) {
console.log("you pressed the Ctrl+Enter")
} enter.ctrlKey检测Ctrl键,event.keyCode == 13检测Enter键。
. 获取浏览器插件的数目
navigator.plugins.length; 用navigator用来检测浏览器的版本、所支持的MIME类型,已安装的外挂程序(plugin)。
29. 实现对Window、 Mac、 UNIX操作系统的操作
var osType = "",
windows = (navigator.userAgent.indexOf("Windows",0)!=-1)?1:0,
mac = (navigator.userAgent.toLowerCase().indexOf("mac",0)!=-1)?1:0,
linux = (navigator.userAgent.indexOf("Linux",0)!=-1)?1:0,
unix = (navigator.userAgent.indexOf("X11",0)!=-1)?1:0; if(windows) osType = "Windows";
else if(mac) osType = "Mac";
else if(linux) osType = "Linux";
else if(unix) osType = "Unix";
console.log(osType); navigator.userAgent表示用户代理。
30. 使用原生javascript判断是否是移动设备浏览器
var MobileReg =/iphone|ipod|android.*mobile|windows.*phone|blackberry.*mobile/i ;
if(mobileReg.test(window.navigator.userAgent.toLowerCase())) {
alert("移动设备!");
}else {
alert("非移动设备!");
}
30段有用的javascript代码的更多相关文章
- 一段有用的javascript加密解密
今天在做一个老项目时,遇到一个需求,在javascript将url中的参数加密解密,从网上找发现了这段有用的代码: <SCRIPT LANGUAGE="JavaScript" ...
- 30段极简Python代码:这些小技巧你都Get了么
学 Python 怎样才最快,当然是实战各种小项目,只有自己去想与写,才记得住规则.本文是 30 个极简任务,初学者可以尝试着自己实现:本文同样也是 30 段代码,Python 开发者也可以看看是不是 ...
- 30段极简Python代码
Python 是机器学习最广泛采用的编程语言,它最重要的优势在于编程的易用性.如果读者对基本的 Python 语法已经有一些了解,那么这篇文章可能会给你一些启发.作者简单概览了 30 段代码,它们都是 ...
- 网页上记录鼠标的点击次数和一段有用的php代码,自己学习使用
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 精心收集的 48 个 JavaScript 代码片段,仅需 30 秒就可理解!
原文:https://github.com/Chalarangelo/30-seconds-of-code#anagrams-of-string-with-duplicates 作者:Chalaran ...
- 精心收集的 48 个 JavaScript 代码片段,仅需 30 秒就可理解
原文:Chalarangelo 译文:IT168 https://github.com/Chalarangelo/30-seconds-of-code#anagrams-of-string-with ...
- 精心收集的48个JavaScript代码片段,仅需30秒就可理解
源文链接 :https://github.com/Chalarangelo/30-seconds-of-code#anagrams-of-string-with-duplicates 该项目来自于 G ...
- 一段奇葩Javascript代码引发的思考
今天与一挚友加同事调试一段奇葩的javascript代码,在分析出结果后,让我萌生了写此篇文章的想法,如有不对之处望指正,也欢迎大家一起讨论.缩减后的js代码如下,你是否能准确说明他的输出值呢? fu ...
- 30 段 JavaScript 代码
1. 前端人员经常遇到的问题就是如何区分IE及非IE浏览器,JavaScript代码是: if(!+[1,]) { //IE11不支持 alert('这是IE浏览器'); }else{ alert(' ...
随机推荐
- (树)判断二叉树是否为BST
题目:判断一颗二叉树是否为BST. 思路:其实这个问题可以有多个解决方法. 方法一:递归解决.根据BST的特性.左边的小于根节点的值,右边的大于根节点的值.并且对于每一棵子树都是如此.所以我们可以直接 ...
- 读取txt文件将文本行组合成特定格式
有一网友要求从txt文本文件读取一些数据,然后组合为特定格式的数据行.原论题如下,刚才开始的要求描述得不太清楚,后来补充完整了. Insus.NET觉得本论题可有练习文本件读取功力,因此尝试实现一下. ...
- [译]Javascript中的闭包(closures)
本文翻译youtube上的up主kudvenkat的javascript tutorial播放单 源地址在此: https://www.youtube.com/watch?v=PMsVM7rjupU& ...
- excel导入工具
1 介绍 excel导入工具 整个项目的代码结构如下 \---excelExport # 导出工具包 | AsyncExportExcel.java #多线程导出 | ExcelImport.java ...
- C# 链表 --增 -删-反转-删除最小值
1. Node.cs namespace 链表 { public class Node<T> { public T Data; //这个就是地址 public Node<T> ...
- spring mvc常用注解标签
@Controller 在SpringMVC 中,控制器Controller 负责处理由DispatcherServlet 分发的请求,它把用户请求的数据经过业务处理层处理之后封装成一个Model , ...
- c++内联 inline
内联声明只是建议 ,不一定就会内联. http://www.voidcn.com/blog/u011327981/article/p-5006835.html
- Loadrunner 性能测试笔记
性能测试脚本 // 关联token 放在请求返回前 web_reg_save_param("tokenId", "LB=,\"tokenId\":\& ...
- loj #2025. 「JLOI / SHOI2016」方
#2025. 「JLOI / SHOI2016」方 题目描述 上帝说,不要圆,要方,于是便有了这道题. 由于我们应该方,而且最好能够尽量方,所以上帝派我们来找正方形.上帝把我们派到了一个有 NNN ...
- c# 中virtual与abstract
在C#的学习中,容易混淆virtual方法和abstract方法的使用,现在来讨论一下二者的区别.二者都牵涉到在派生类中与override的配合使用. 一.Virtual方法(虚方法) virtual ...