commonJS — 全局操作(for Window)
for Window
github: https://github.com/laixiangran/commonJS/blob/master/src/forWindow.js
代码
/**
* Created by laixiangran on 2016/1/24
* homepage:http://www.cnblogs.com/laixiangran/
* for Window
*/
(function() {
var com = window.COM = window.COM || {};
com.$W = {
/**
* 在window.onload前执行,相当于jq的ready()
* 使用domReady.ready()将执行函数加入队列中
**/
domReady: (function() {
// 用于添加要执行的函数
var domReady = function() {
var fnArr = Array.prototype.slice.call(arguments);
// 页面如果加载完毕则直接运行
if (domReady.isReady) {
fnArr.forEach(function(fn) {
fn();
});
}
else {
domReady.fns = fnArr;
}
};
// 用于判定页面是否加载完毕
domReady.isReady = false;
domReady.fns = [];
// 执行所有在window.onload之前放入的函数
domReady.fireReady = function() {
if (!domReady.isReady) {
if (!document.body) {
return setTimeout(domReady.fireReady, 16);
}
domReady.isReady = true;
if (domReady.fns.length) {
domReady.fns.forEach(function(fn) {
fn();
});
}
}
};
// 开始初始化domReady函数,判定页面的加载情况
if (document.readyState === "complete") {
domReady.fireReady();
} else if (-[1,]) {
document.addEventListener("DOMContentLoaded", function() {
document.removeEventListener("DOMContentLoaded", arguments.callee, false);
domReady.fireReady();
}, false);
} else {
// 当页面包含图片时,onreadystatechange事件会触发在window.onload之后,
// 换言之,它只能正确地执行于页面不包含二进制资源或非常少或者被缓存时
document.attachEvent("onreadystatechange", function() {
if (document.readyState == "complete") {
document.detachEvent("onreadystatechange", arguments.callee);
domReady.fireReady();
}
});
(function(){
if (domReady.isReady) {
return;
}
// doScroll存在于所有标签而不管其是否支持滚动条
// 这里如果用document.documentElement.doScroll(),我们需要判定其是否位于顶层document
var node = new Image();
try {
node.doScroll();
node = null; // 防止IE内存泄漏
}catch (e) {
// javascrpt最短时钟间隔为16ms,这里取其倍数
setTimeout(arguments.callee, 64);
return;
}
domReady.fireReady();
})();
}
return domReady;
}()),
/**
* requestAnimationFrame兼容性扩展,两方面工作:
* 1、把各浏览器前缀进行统一
* 2、在浏览器没有requestAnimationFrame方法时将其指向setTimeout方法
* */
requestAnimationFrame: (function() {
var func = null;
var lastTime = 0;
var vendors = ["webkit", "moz"];
for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
func = window[vendors[x] + "RequestAnimationFrame"];
}
if (!func) {
func = function(callback, element) {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16.7 - (currTime - lastTime));
var id = window.setTimeout(function() {
callback(currTime + timeToCall);
}, timeToCall);
lastTime = currTime + timeToCall;
return id;
};
}
return func;
}()),
// 取消AnimationFrame
cancelAnimationFrame: (function() {
var func = null;
var vendors = ["webkit", "moz"];
for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
// Webkit中此取消方法的名字变了
window.cancelAnimationFrame = window[vendors[x] + "CancelAnimationFrame"] || window[vendors[x] + "CancelRequestAnimationFrame"];
}
if (!func) {
func = function(id) {
window.clearTimeout(id);
};
}
return func;
}())
};
}());
参考
commonJS — 全局操作(for Window)的更多相关文章
- Vue2.0 - 全局操作 Vue.set
引:http://www.cnblogs.com/zccblog/p/7192420.html Vue.set 的作用就是在构造器外部操作构造器内部的数据.属性或者方法.比如在vue构造器内部定义了一 ...
- Vue2.0 【第二季】第3节 Vue.set全局操作
目录 Vue2.0 [第二季]第3节 Vue.set全局操作 第3节:Vue.set全局操作 一.引用构造器外部数据 二.在外部改变数据的三种方法: 三.为什么要有Vue.set的存在? Vue2.0 ...
- commonJS — 浏览器操作(for Browser)
for Browser github: https://github.com/laixiangran/commonJS/blob/master/src/forBrowser.js 代码 /** * C ...
- WPF Touch操作滚动条,Window弹跳
WPF,用ScrollViewer控件,触屏开发,当滑动到最后时会使整个窗体弹跳一下 原因是因为ScrollViewer触屏操作原生支持惯性,ScrollViewer中的内容滚动到边界是会自动触发Wi ...
- JavaScript的DOM操作。Window.document对象
间隔执行一段代码:window.setlnteval("需要执行的代码",间隔毫秒数) 例 : window.setlnteval("alert("你 ...
- commonJS — 字符串操作(for String)
for String github: https://github.com/laixiangran/commonJS/blob/master/src/forString.js 代码 /** * Cre ...
- commonJS — 对象操作(for Object)
for Object github: https://github.com/laixiangran/commonJS/blob/master/src/forObject.js 代码 /** * Cre ...
- commonJS — 数字操作(for Number)
for Number github: https://github.com/laixiangran/commonJS/blob/master/src/forNumber.js 代码 /** * Cre ...
- commonJS — 函数操作(for Function)
for Function github: https://github.com/laixiangran/commonJS/blob/master/src/forFunction.js 代码 /** * ...
随机推荐
- 学习java annotation
Annotation介绍 内置注解 自定义注解 元注解 /** * 测试自定义注解的使用 * */ @SxtAnnotation01 public class Demo02 { @Annotation ...
- 2016年11月29日 星期二 --出埃及记 Exodus 20:20
2016年11月29日 星期二 --出埃及记 Exodus 20:20 Moses said to the people, "Do not be afraid. God has come t ...
- python学习笔记五 模块上(基础篇)
模块学习 模块,用一砣代码实现了某个功能的代码集合. 类似于函数式编程和面向过程编程,函数式编程则完成一个功能,其他代码用来调用即可,提供了代码的重用性和代码间的耦合.而对于一个复杂的功能来,可能需要 ...
- #define用法集锦
Definition: The #define Directive You can use the #define directive to give a meaningful name to a c ...
- 第六课 SQLite
总结:SQLite 1.SQLite的数据类型: NULL(空值).INTEGER(整型值).READL(浮点值).TEXT(字符串值).BLOB(二进制对象); 2.SQLite的应用 2.1 SQ ...
- Web文件的ContentType类型收集
".*"="application/octet-stream"".001"="application/x-001"&qu ...
- Cheatsheet: 2014 10.01 ~ 10.30
.NET ASP.NET Web Api: Unwrapping HTTP Error Results and Model State Dictionaries Client-Side HTTP 20 ...
- jquery之html(),text()方法详解
一:html() html()函数用于设置或返回当前jQuery对象所匹配的DOM元素内的html内容. 该函数的用途相当于设置或获取DOM元素的innerHTML属性值. 该函数属于jQuery对象 ...
- 图片轮播的JS写法,通用涉及多个轮播
本代码是借鉴大神的代码分析理解后,自己改写的!有不足指出希望给为大神指点. 核心只有一个JS,里面包含了css样式. 展示效果图:
- Spring的IoC容器注入的类型
Spring除了可以注入Bean实例外,还可以注入其他数据类型. 注入基本数据类型 xml配置文件中的init-method="init"属性是取得Bean实例之后,输入属性值后自 ...