封装方法公共文件common.js
/**
* Created by Administrator on 2017/3/24.
*/
/**
* 格式化日期
* @param dt 日期对象
* @returns {string} 返回值是格式化的字符串日期
*/
function getDates(dt) {
var str = "";//存储时间的字符串
//获取年
var year = dt.getFullYear();
//获取月
var month = dt.getMonth() + 1;
//获取日
var day = dt.getDate();
//获取小时
var hour = dt.getHours();
//获取分钟
var min = dt.getMinutes();
//获取秒
var sec = dt.getSeconds();
month = month < 10 ? "0" + month : month;
day = day < 10 ? "0" + day : day;
hour = hour < 10 ? "0" + hour : hour;
min = min < 10 ? "0" + min : min;
sec = sec < 10 ? "0" + sec : sec;
str = year + "年" + month + "月" + day + "日 " + hour + ":" + min + ":" + sec;
return str;
}
/**
* 获取指定标签对象
* @param id 标签的id属性值
* @returns {Element}根据id属性值返回指定标签对象
*/
function my$(id) {
return document.getElementById(id);
}
/**
* 设置元素的文本内容
* @param element 任意元素
* @param text 任意文本内容
*/
function setInnerText(element, text) {
if (typeof(element.textContent) == "undefined") {
element.innerText = text;
} else {
element.textContent = text;
}
}
/**
* 获取元素的文本内容
* @param element 任意元素
* @returns {*} 任意元素中的文本内容
*/
function getInnerText(element) {
if (typeof(element.textContent) == "undefined") {
return element.innerText;
} else {
return element.textContent;
}
}
/**
* 获取父级元素中的第一个子元素
* @param element 父级元素
* @returns {*} 父级元素中的子级元素
*/
function getFirstElement(element) {
if (element.firstElementChild) {
return element.firstElementChild;
} else {
var node = element.firstChild;
while (node && node.nodeType != 1) {
node = node.nextSibling;
}
return node;
}
}
/**
* 获取父级元素中的最后一个子元素
* @param element 父级元素
* @returns {*} 最后一个子元素
*/
function getLastElement(element) {
if (element.lastElementChild) {
return element.lastElementChild;
} else {
var node = element.lastChild;
while (node && node.nodeType != 1) {
node = node.previousSibling;
}
return node;
}
}
/**
* 获取某个元素的前一个兄弟元素
* @param element 某个元素
* @returns {*} 前一个兄弟元素
*/
function getPreviousElement(element) {
if (element.previousElementSibling) {
return element.previousElementSibling
} else {
var node = element.previousSibling;
while (node && node.nodeType != 1) {
node = node.previousSibling;
}
return node;
}
}
/**
* 获取某个元素的后一个兄弟元素
* @param element 某个元素
* @returns {*} 后一个兄弟元素
*/
function getNextElement(element) {
if (element.nextElementSibling) {
return element.nextElementSibling
} else {
var node = element.nextSibling;
while (node && node.nodeType != 1) {
node = node.nextSibling;
}
return node;
}
}
/**
* 获取某个元素的所有兄弟元素
* @param element 某个元素
* @returns {Array} 兄弟元素
*/
function getSiblings(element) {
if (!element)return;
var elements = [];
var ele = element.previousSibling;
while (ele) {
if (ele.nodeType === 1) {
elements.push(ele);
}
ele = ele.previousSibling;
}
ele = element.nextSibling;
while (ele) {
if (ele.nodeType === 1) {
elements.push(ele);
}
ele = ele.nextSibling;
}
return elements;
}
/**
* 返回当前浏览器是什么类型的浏览器
*/
function userBrowser(){
var browserName=navigator.userAgent.toLowerCase();
if(/msie/i.test(browserName) && !/opera/.test(browserName)){
console.log("IE");
}else if(/firefox/i.test(browserName)){
console.log("Firefox");
}else if(/chrome/i.test(browserName) && /webkit/i.test(browserName) && /mozilla/i.test(browserName)){
console.log("Chrome");
}else if(/opera/i.test(browserName)){
console.log("Opera");
}else if(/webkit/i.test(browserName) &&!(/chrome/i.test(browserName) && /webkit/i.test(browserName) && /mozilla/i.test(browserName))){
console.log("Safari");
}else{
console.log("不知道什么鬼!");
}
}
function getStyle(element,attr) {
return element.currentStyle?element.currentStyle[attr]:window.getComputedStyle(element,null)[attr];
}
//缓动动画函数的封装
function animate(element, json,fn) {
clearInterval(element.timeId);
element.timeId = setInterval(function () {
var flag=true;
for (var attr in json) {
if(attr=="opacity"){
var current = getStyle(element, attr)*100;
var target=json[attr]*100;
//每次移动的步数
var step = (target - current) / 10;
//每次移动步数都是整数(比较大的数字)
step = step > 0 ? Math.ceil(step) : Math.floor(step);
current += step;//移动后的当前的像素
element.style[attr] = current/100;
}else if(attr=="zIndex"){
element.style[attr]=json[attr];
}else{
var current = parseInt(getStyle(element, attr));
var target=json[attr];
//每次移动的步数
var step = (target - current) / 10;
//每次移动步数都是整数(比较大的数字)
step = step > 0 ? Math.ceil(step) : Math.floor(step);
current += step;//移动后的当前的像素
element.style[attr] = current + "px";
}
if (current != target) {//到达目标后停止计时器
flag=false;
}
}
if(flag){
clearInterval(element.timeId);//清理计时器
if(fn){
fn();
}
}
console.log("target:" + target + ",current:" + current + ",step:" + step);
}, 20);
}
//关于事件参数对象的工具的代码
var evtTools={
//事件参数
evt:function (e) {
return window.event?window.event:e;
},
//页面向左卷曲出去的距离
left:function () {
return window.pageXOffset||document.body.scrollLeft||document.documentElement.scrollLeft||0;
},
//页面向上卷曲出去的距离
top:function () {
return window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop||0;
},
//事件参数对象中的属性封装---可视区域的横坐标
clientX:function (e) {
return this.evt(e).clientX;
},
//事件参数对象中的属性封装---可视区域的纵坐标
clientY:function (e) {
return this.evt(e).clientY;
},
pageX:function (e) {
return this.evt(e).pageX?this.evt(e).pageX:this.left()+this.clientX(e);
},
pageY:function (e) {
return this.evt(e).pageY?this.evt(e).pageY:this.top()+this.clientY(e);
}
};
//当浏览器的宽度发生变化,就获取浏览器(页面可视区域的宽度)
function getClient() {
return{
width:window.innerWidth||document.body.clientWidth||document.documentElement.clientWidth||0,
height:window.innerHeight||document.body.clientHeight||document.documentElement.clientHeight||0
}
}
封装方法公共文件common.js的更多相关文章
- vue 中如何对公共css、 js 方法进行单文件统一管理,全局调用
1.前言 最近,为公司开发交付的一个后台管理系统项目,我使用了 Vue 框架进行开发实践. 模块化.组件化.工程化的开发体验非常好.良好的 api,优雅的设计,对于工程师非常友好. 但是由于模块比较多 ...
- 封装自己的Common.js工具库
Code/** * Created by LT on 2013/6/16. * Common.js * 对原生JS对象的扩展 * Object.Array.String.Date.Ajax.Cooki ...
- 常用js方法整理common.js
项目中常用js方法整理成了common.js var h = {}; h.get = function (url, data, ok, error) { $.ajax({ url: url, data ...
- Asp.net Core中使用NLog,并封装成公共的日志方法
1.安装NLog "NLog.Extensions.Logging": "1.0.0-rtm-alpha4" 2.配置NLog public void Conf ...
- 【转】第6篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:自动注册JS脚本+自动反射方法分析
作者: 牛A与牛C之间 时间: 2013-11-21 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第6篇:Xilium CefGlue 关于 CLR Object 与 JS ...
- 【转】第5篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:自动注册JS脚本+委托回调方法分析
作者: 牛A与牛C之间 时间: 2013-11-19 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第5篇:Xilium CefGlue 关于 CLR Object 与 JS ...
- 项目中常用js方法整理common.js
抽空把项目中常用js方法整理成了common.js,都是网上搜集而来的,大家一起分享吧. var h = {}; h.get = function (url, data, ok, error) { $ ...
- js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用)
js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用) 一.总结 2.匿名函数作为参数传递 二.js进阶ajax函数封装 ajax1.js function ajax(ur ...
- JS高级---案例贪吃蛇,把封装的函数移动到js文件中
案例贪吃蛇,把封装的函数移动到js文件中 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
随机推荐
- socketserver实现FTP
功能: 1.用户加密认证 2.允许同时多用户登录 3.每个用户有自己的家目录 ,且只能访问自己的家目录 4.对用户进行磁盘配额,每个用户的可用空间不同 5.允许用户在ftp server上随意切换目录 ...
- App设计模式纵横谈(1)
对我的文章和培训课程感兴趣的可以加我微信16230091进行关注. —————————————————————————————————— 今天聊聊我沉淀比较久的一门技术,设计模式.这里是第一篇,算是概 ...
- uboot处理dtb
目录 uboot处理dtb 传递参数给内核 dtb 地址选择 dtb修改 移植fdt title: uboot处理dtb date: 2019/4/28 17:18:19 toc: true --- ...
- Vue学习笔记八:v-for,v-if,v-show指令
目录 v-for指令:遍历 HTML和效果图 v-for讲解 v-if和v-show:创建,删除,显示,隐藏 HTML和效果图 v-if和v-show的原理 v-for指令:遍历 HTML和效果图 有 ...
- Android 使用 HTTPS 问题解决(SSLHandshakeException)
title date categories tags Android 5.0以下TLS1.x SSLHandshakeException 2016-11-30 12:17:02 -0800 Andro ...
- 往github提交代码流程
一 首先在Github新建一个仓库,回到首页,点击右上角的New repository新建仓库. 二 在本地依次使用下面命令 …or create a new repository on the c ...
- Spring Boot Debug调试
在使用spring-boot:run进行启动的时候,如果设置的断点进不去,要进行以下的设置. 1.添加jvm参数配置 在spring-boot的maven插件加上jvmArguments配置. < ...
- mongodb4.0.2 复制集主从部署
介绍 复制集(Replica Sets),是一个基于主/从复制机制的复制功能,进行同一数据的异步同步,从而使多台机器拥有同一数据的都多个副本,由于有自动故障转移和恢复特性,当主库宕机时不需要用户干预的 ...
- mysql修改数据路径
步凑: 1.关闭mysql服务 [root@localhost /]# service mysqld stop 2.移动mysql文件夹到自定义的目录 [root@localhost /]# mv / ...
- maven-assembly-plugin的使用
maven-assembly-plugin使用描述(拷自 maven-assembly-plugin 主页) The Assembly Plugin for Maven is primarily in ...