一些逼格略高的 js 片段
// 一个接一个运行
// timeout 不能直接放在 for 里面,暂时不知道为什么
function functionOneByOne(fn, times, duration) {
for(var i=0; i<times; i++) {
timecout(i);
}
function timecout(index) {
setTimeout(function(){
if (fn) fn(index);
}, duration*index);
}
}
// 区间内持续时间的变化,比如可以做平滑动画什么的
function smooth(start, end, duration, fn) {
var start = start || 0,
end = end || 0,
offset = end - start,
duration = duration || 1000,
now = Date.now(); a(); function a() {
var x = Math.min(1, (Date.now() - now) / duration);
if (fn) fn(offset * x + start);
1 > x && setTimeout(a, 10);
}
}
// 求数组 arr 中的最大最小值
Math.max.apply(Math, arr);
Math.min.apply(Math, arr);
//字符串去首尾空格
String.prototype.trim = function(){return this.replace(/^\s+|\s+$/g, "");};
// 区间内的随机数
function RandomNumber(min, max) {
return (min||0) + Math.random() * ((max||1) - (min||0));
}
// 获取 search 中对应键的值
function GetQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
// 生成一个连续数字的数组
function creatNumberArray(length, start) {
var arr = []; start = start || 0;
for(var i=start; arr.push(i++)<length;);
return arr;
}
// 数字数组 arr 改成从小到大排序
arr.sort(function(a,b){return Math.random()>0.5 ? -1 : 1;});
// 获得 dom 元素,可传入 类名/索引/对象
function getElem(o, box) {
if (typeof o == "string") return document.querySelector(obj);
else if (typeof o == "number") return getObj(box).eq(o)[0];
else if (typeof o == "object") {
if (typeof o.css == "function") return o[0];
else return o;
}
}
// 获取 jquery 元素,参数同上
function getObj(o, box) {
if (typeof o == "string") return $(o);
else if (typeof o == "number") return getObj(box).eq(o);
else if (typeof o == "object") {
if (typeof o.css == "function") return o;
else return $(o);
}
}
// 将 html 编译成 text
function encodeHTML( str ) {
var elem = document.createElement('span');
elem.appendChild( document.createTextNode( str ) );
return elem.innerHTML;
}
// 将 text 编译成 html
function decodeHTML( str ) {
str = str.replace(/</g,'<').replace(/>/g,'>')
var elem = document.createElement('span');
elem.innerHTML = str;
return elem.textContent || elem.innerText;
}
// 产生随机颜色
function randomColor() {
var rand = Math.floor(Math.random() * 0xFFFFFF).toString(16);
if (rand.length == 6) return '#' + rand;
else return randomColor();
}
这些方法个人都用得挺多的,然后再分享一个最近发现的装逼技能。
var x = i * i, i == 5 && fn();
// “,” 虽然看上去和 “;” 类似,但更容易表明 i 和 fn() 有基情
// 其次,&& 则类同于 if(i == 5) fn(); 是不是很带感, i < 10 || fn(); 则能等同于 if(i != 5) fn();
一些逼格略高的 js 片段的更多相关文章
- 编写高质量JS代码的68个有效方法(八)
[20141227]编写高质量JS代码的68个有效方法(八) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...
- 编写高质量JS代码的68个有效方法(七)
[20141220]编写高质量JS代码的68个有效方法(七) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...
- 编写高质量JS代码的68个有效方法(六)
[20141213]编写高质量JS代码的68个有效方法(六) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...
- 编写高质量JS代码的68个有效方法(四)
[20141129]编写高质量JS代码的68个有效方法(四) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...
- 编写高质量JS代码的68个有效方法(三)
[20141030]编写高质量JS代码的68个有效方法(三) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...
- 编写高质量JS代码的68个有效方法(二)
[20141011]编写高质量JS代码的68个有效方法(二) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...
- JavaScript手札:《编写高质量JS代码的68个有效方法》(一)(1~5)
编写高质量JS代码的68个有效方法(一) *:first-child { margin-top: 0 !important; } body>*:last-child { margin-botto ...
- 广告等第三方应用嵌入到web页面方案 之 使用js片段
在自己的项目中嵌入过广告的朋友们可能都用过百度联盟, 只需要嵌入如下一段js代码片段, 就可以在自己的项目中嵌入广告, 来获得收益. <script type="text javasc ...
- 编写高质量JS代码中
前段时间看了几道关于前端javascript的面试题目,方觉函数调用模式等基础的重要性.于是,下定决心,好好补补基础,即便不能深入语言的内部设计模式,也要对基本面向对象概念有比较深入的理解. 继续上一 ...
随机推荐
- 【转】windows下python开发环境搭建
1 -- 安装python的前期准备 Python开发有众多工具,又以Eclipse+Pydev最为常见.Eclipse平台对开发同学来讲,肯定是如雷贯耳,自不用废话.而PyDev是Eclipse平台 ...
- Servlet 部署
默认情况下,Servlet 应用程序位于路径 <Tomcat-installation-directory>/webapps/ROOT 下,且类文件放在 <Tomcat-instal ...
- 在eclipse中使用枚举简单类型enum
在JAVA中终于可以使用枚举类型了,就像在C或C++使用的简单枚举. 首先就在eclipse中试试它吧. 没想到,却报了错误.我装了jdk1.5(5.0),也在eclipse中设置了,怎么会不认识en ...
- 傅里叶叠层成像FP(Fourier Ptychographic Imaging)查资料
傅里叶叠层成像FP(Fourier Ptychographic Imaging) 傅里叶叠层显微术(FPM)是一种新型的计算显微成像技术,FPM与传统显微术照明方式不同,常采用可编程LED阵列进行不同 ...
- Failed to load the JNI shared library jvm.dl
. 原因1:该目录下jvm.dll不存在 2 解决办法:重新安装jdk或者jre并配置好环境变量.copy一个jvm.dll放在该目录下 3 原因2:eclipse的版本与jdk或者jre版本不一致 ...
- [转]C++ new操作符详解
原文地址:http://blog.csdn.net/youdianmengxiangba/article/details/8233651 写在前面: 我最近写的一些博客都是因为在面试笔试过程中遇到的一 ...
- go http的三种实现---1
package main import ( "io" "log" "net/http" ) func main() { //设置路由 htt ...
- gitlab报错收集
登录502报错 一般是权限问题,解决方法: /var/log/gitlab 如果还不行,请检查你的内存,安装使用GitLab需要至少4GB可用内存(RAM + Swap)! 由于操作系统和其他正在运行 ...
- mysql 集群的一些概念
读写分离: 主备机有 master-master方式,mysql自己提供两个机器之间的备份 binlog方式,一个机器master 用于写数据,一个用于读数据,写数据的那个机器也应有读读功能,有既有读 ...
- Nginx 解决WebSocket TCP 转发问题
背景: IM 即时通讯时候 , 前期我用的是IP 没什么问题,当然上线肯定要搞个域名搞搞了! 那么问题来了------>Nginx 我按照原先那样配置时候不行了, 连接不了. 解决方法: ...