用单例模式封装常用方法 utils class v1.0
utils class v1.0:The common methods used in our JS are included.
* by sarah on 2016/01/28 var utils = {
//listToArray:将类数组转换为数组
listToArray: function listToArray(likeAry) {
var ary = [];
try {
ary = Array.prototype.slice.call(likeAry, 0);
} catch (e) {
for (var i = 0; i < likeAry.length; i++) {
ary[ary.length] = likeAry[i];
}
}
return ary;
}, //toJSON:将字符串转换为JSON格式的对象
toJSON: function toJSON(str) {
return "JSON" in window ? JSON.parse(str) : eval("(" + str + ")");
}
}; //win:获取或者设置和浏览器相关的盒子模型信息
utils.win = function win(attr, value) {
if (typeof value === "undefined") {
return document.documentElement[attr] || document.body[attr];
}
document.documentElement[attr] = value;
document.body[attr] = value;
}; //getCss:获取当前元素经过浏览器计算的样式
utils.getCss = function getCss(curEle, attr) {
var val = reg = null;
if ("getComputedStyle" in window) {
val = window.getComputedStyle(curEle, null)[attr];
} else {
if (attr === "opacity") {
val = curEle.currentStyle["filter"];
reg = /^alpha\(opacity=(\d+(?:\.\d+)?)\)$/;
val = reg.test(val) ? reg.exec(val)[1] / 100 : 1;
} else {
val = curEle.currentStyle[attr];
}
}
reg = /^-?\d+(\.\d+)?(px|pt|em|rem)?$/;
return reg.test(val) ? parseFloat(val) : val;
}; //offset:获取元素距离body的偏移量(不管body是否为父级参照物)
utils.offset = function offset(curEle) {
var t = curEle.offsetTop, l = curEle.offsetLeft, p = curEle.offsetParent;
while (p) {
if (navigator.userAgent.indexOf("MSIE 8.0") === -1) {
t += p.clientTop;
l += p.clientLeft;
}
t += p.offsetTop;
l += p.offsetLeft;
p = p.offsetParent;
}
return {top: t, left: l};
}; /*--------------------------------------------------*/ //prev:获取当前元素的上一个哥哥元素节点
utils.prev = function prev(curEle) {
if ("previousElementSibling" in curEle) {
return curEle.previousElementSibling;
}
var pre = curEle.previousSibling;
while (pre && pre.nodeType !== 1) {
pre = pre.previousSibling;
}
return pre;
}; //prevAll:获取当前元素的所有的哥哥元素节点
utils.prevAll = function prevAll(curEle) {
//this->utils
var ary = [], pre = this.prev(curEle);
while (pre) {
ary.unshift(pre);
pre = this.prev(pre);
}
return ary;
}; //next:获取当前元素的下一个弟弟元素节点
utils.next = function next(curEle) {
if ("nextElementSibling" in curEle) {
return curEle.nextElementSibling;
}
var nex = curEle.nextSibling;
while (nex && nex.nodeType !== 1) {
nex = nex.nextSibling;
}
return nex;
}; //nextAll:获取当前元素的所有的弟弟元素节点
utils.nextAll = function nextAll(curEle) {
var ary = [], nex = this.next(curEle);
while (nex) {
ary[ary.length] = nex;
nex = this.next(nex);
}
return ary;
}; //sibling:获取当前元素的相邻节点(上一个哥哥+下一个弟弟)
utils.sibling = function sibling(curEle) {
var pre = this.prev(curEle), nex = this.next(curEle);
var ary = [];
pre ? ary[ary.length] = pre : null;
nex ? ary[ary.length] = nex : null;
return ary;
}; //sibling:获取当前元素的兄弟元素节点(哥哥+弟弟)
utils.siblings = function sibling(curEle) {
return this.prevAll(curEle).concat(this.nextAll(curEle));
}; //getIndex:获取当前元素的索引,有几个哥哥,我的索引就是几
utils.getIndex = function getIndex(curEle) {
return this.prevAll(curEle).length;
}; /*--------------------------------------------------*/ //hasClass:判断当前元素是否包含某个样式类名
utils.hasClass = function hasClass(curEle, cName) {
var reg = new RegExp("(?:^| +)" + cName + "(?: +|$)");
return reg.test(curEle.className);
}; //addClass:给当前的元素增加样式类名
utils.addClass = function addClass(curEle, cName) {
if (!this.hasClass(curEle, cName)) {//->首先判断当前的元素中是否已经存在cName这个样式名了,存在就不在增加了...
curEle.className += " " + cName;
}
}; //removeClass:给当前的元素移除某一个样式类名
utils.removeClass = function removeClass(curEle, cName) {
if (this.hasClass(curEle, cName)) {//->首先判断当前的元素中是否已经存在cName这个样式名了,有的话才移除...
var reg = new RegExp("(?:^| +)" + cName + "(?: +|$)", "g");
curEle.className = curEle.className.replace(reg, " ");
}
}; /*--------------------------------------------------*/ //children:获取当前元素下所有的元素子节点,如果传递了tag值,意思是在所有的子元素节点中在把标签名为tag的筛选出来
utils.children = function children(curEle, tag) {
var nodeList = curEle.childNodes, ary = [];
for (var i = 0; i < nodeList.length; i++) {
var cur = nodeList[i];
if (cur.nodeType === 1) {
if (typeof tag !== "undefined") {
var reg = new RegExp("^" + tag + "$", "i");
reg.test(cur.tagName) ? ary[ary.length] = cur : null;
continue;
}
ary[ary.length] = cur;
}
}
return ary;
}; /*--------------------------------------------------*/ //getElementsByClass:通过元素的样式类名,在指定的上下文中获取相关的元素
utils.getElementsByClass = function getElementsByClass(strClass, context) {
context = context || document;
if ("getElementsByClassName" in document) {
return this.listToArray(context.getElementsByClassName(strClass));
}
var tagList = context.getElementsByTagName("*"), ary = [];
strClass = strClass.replace(/(^ +| +$)/g, "").split(/ +/);
for (var i = 0; i < tagList.length; i++) {
var curTag = tagList[i], curTagClass = curTag.className;
var flag = true;
for (var k = 0; k < strClass.length; k++) {
var reg = new RegExp("(?:^| +)" + strClass[k] + "(?: +|$)");
if (!reg.test(curTagClass)) {
flag = false;
break;
}
}
flag ? ary[ary.length] = curTag : null;
}
return ary;
}; //->getCss:设置当前元素的某一个样式属性的值
function setCss(curEle, attr, value) {
if (attr === "float") {
curEle["style"]["cssFloat"] = value;
curEle["style"]["styleFloat"] = value;
return;
}
if (attr === "opacity") {
value > 1 ? value = 1 : null;
value < 0 ? value = 0 : null;
curEle["style"]["opacity"] = value;
curEle["style"]["filter"] = "alpha(opacity=" + value * 100 + ")";
return;
}
var reg = /^(width|height|(padding|margin(Top|Left|Right|Bottom))|top|left|right|bottom)$/;
if (reg.test(attr)) {
reg = /^-?\d+(\.\d+)?$/;
if (reg.test(value)) {
curEle["style"][attr] = value + "px";
return;
}
}
curEle["style"][attr] = value;
}
用单例模式封装常用方法 utils class v1.0的更多相关文章
- 【iCore3 双核心板】iCore3封装库及使用说明V1.0
iCore3封装库及使用说明下载链接: http://pan.baidu.com/s/1pLq23Qb iCore3 购买链接: https://item.taobao.com/item.htm?id ...
- Farseer.net轻量级ORM开源框架 V1.0 开发目标
本篇主要给大家说明下在V1.0中,计划开发的任务的状态.按照国际惯例.上大表格 开发计划状态 编号 模块 状态 说明 1 分离Utils.Extend.UI √ 在V0.2版本中,是集成在一个项 ...
- 【VIP视频网站项目】VIP视频网站项目v1.0.3版本发布啦(程序一键安装+电影后台自动抓取+代码结构调整)
在线体验地址:http://vip.52tech.tech/ GIthub源码:https://github.com/xiugangzhang/vip.github.io 项目预览 主页面 登录页面 ...
- ASP.NET Boilerplate终于发布v1.0了
(此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 题记:ABP经过2年多的开发,终于发布第一个主要版本了,谨此提醒ABP的使用者. ASP.N ...
- 03-c#入门(简易存款利息计算器v1.0)
本想把练习题做了的结果放上来,不过发现附录是有答案的,就算了吧,自己做了没问题就行了哈.之前提到过,要是有朋友有想法,需要做小工具我可以帮忙实现,不过貌似大家都很忙.SO,自己学完第4章后,决定做一个 ...
- [iOS UI进阶 - 2.0] 彩票Demo v1.0
A.需求 1.模仿“网易彩票”做出有5个导航页面和相应功能的Demo 2.v1.0 版本搭建基本框架 code source:https://github.com/hellovoidworld/H ...
- python 以单例模式封装logging相关api实现日志打印类
python 以单例模式封装logging相关api实现日志打印类 by:授客QQ:1033553122 测试环境: Python版本:Python 2.7 实现功能: 支持自由配置,如下lo ...
- Python WSGI v1.0 中文版(转)
add by zhj: WSGI全称Web Server Gateway Interface,即Web网关接口.其实它并不是OSI七层协议中的协议,它就是一个接口而已,即函数,而WSGI规定了该接口的 ...
- 痞子衡嵌入式:kFlashFile v1.0 - 一个基于Flash的掉电数据存取方案
大家好,我是痞子衡,是正经搞技术的痞子.今天给大家带来的是痞子衡的个人小项目 - kFlashFile. 痞子衡最近在参与一个基于 i.MXRT1170 的项目,项目有个需求,需要在 Flash 里实 ...
随机推荐
- 对android应用一些破解的方法
因为需要破解一款应用,找了些资料 Android手机中的程序文件夹拷贝到别的Android手机上还能用么? xx.apk Android个人破解应用新思路 安卓手机下xx.apk JAVA破解之旅 s ...
- Android那些事儿之LBS定位,实践测试lbs
最近一朋友让我了解下安卓LBS获取位置信息,于是动手实践了一把.搜了一圈发现有篇博文可以参考:Android那些事儿之LBS定位,但是原文作者没有提供源码下载,于是动手实现了,现记录下来备忘,代码附在 ...
- APP-BOM-20516 错误处理一例
昨天在处理一个工单异常时,需要将一个Released的工单改为Unreleased状态,程序报APP-BOM-20516错误,如下图.百度只搜到两条记录,均无用.Google能搜到的多一些,也无用.进 ...
- JAVA 多线程编程之一(基础)
1.原子变量(java.util.concurrent.atomic) 原子状态,变化不会被打断,如 AtomicLong , AtomicInteger 2.内部锁 synchronized 块 ...
- 项目演化系列--验证体系(基于angular的前端验证)
前言 之前分享的<web项目演化--验证体系>中提到基于angular的验证,但是为了以防读者迷惑,能够好的理解验证体系,所以没有详细介绍. 今天特地补写一篇关于构建angular的验证. ...
- zk框架销毁Page上的Component
销毁Page上的Component ZK的组件之间是树状结构的,每一组件都只有一个根. 从页面上销毁一个组件可以通过下面两种方式来实现: 1. 组件不是根组件时:Component.setParent ...
- java攻城师之路--复习java web之jsp入门_El表达式_JSTL标签库
JSP 技术掌握:JSP语法 + EL + JSTL 为什么sun推出 JSP技术 ? Servlet 生成网页比较复杂,本身不支持HTML语法,html代码需要通过response输出流输出,JSP ...
- 在redhat上搭建redmine
搞个项目管理的东西 找了下还是redmine比较合适,行动action: 1.ruby 额 是的你没有看错 需要先安装一个ruby的环境.话说这个安装起来很是纠结,本来想用yum 结果咩有成功,于是乎 ...
- 《编写高质量代码:改善C#程序的157个建议》源码下载
==== 目录 前 言第一部分 语言篇第1章 基本语言要素 / 2建议1:正确操作字符串 / 2建议2:使用默认转型方法 / 6建议3:区别对待强制转型与as和is / 9建议4:TryParse比P ...
- HTML5探索一(那些新增的标签和属性)
tml5相比html4,添加了部分语义化的标签和属性,现在我们就从这些标签和属性开始,学习html5吧. 首先,认识下HTML5新的文档类型: <!DOCTYPE html> 那些新标签 ...