Jquery作者John Resig自己封装的javascript 常用函数


Posted in Javascript onNovember 09, 2009
//获取元素的样式值。 
function getStyle(elem,name){ 
if(elem.style[name]){ 
return elem.style[name]; 
}else if(elem.currentStyle){ 
return elem.currentStyle[name]; 
}else if(document.defaultView&&document.defaultView.getComputedStyle){ 
name=name.replace(/([A-Z])/g,”-$1″); 
name=name.toLowerCase(); 
var s=document.defaultView.getComputedStyle(elem,”"); 
return s&&s.getPropertyValue(name); 
}else{ 
return null 
} 
} 
//获取元素相对于这个页面的x和y坐标。 
function pageX(elem){ 
return elem.offsetParent?(elem.offsetLeft+pageX(elem.offsetParent)):elem.offsetLeft; 
} 
function pageY(elem){ 
return elem.offsetParent?(elem.offsetTop+pageY(elem.offsetParent)):elem.offsetTop; 
} 
//获取元素相对于父元素的x和y坐标。 
function parentX(elem){ 
return elem.parentNode==elem.offsetParent?elem.offsetLeft:pageX(elem)-pageX(elem.parentNode); 
} 
function parentY(elem){ 
return elem.parentNode==elem.offsetParent?elem.offsetTop:pageY(elem)-pageY(elem.parentNode); 
} 
//获取使用css定位的元素的x和y坐标。 
function posX(elem){ 
return parseInt(getStyle(elem,”left”)); 
} 
function posY(elem){ 
return parseInt(getStyle(elem,”top”)); 
} 
//设置元素位置。 
function setX(elem,pos){ 
elem.style.left=pos+”px”; 
} 
function setY(elem,pos){ 
elem.style.top=pos+”px”; 
} 
//增加元素X和y坐标。 
function addX(elem,pos){ 
set(elem,(posX(elem)+pos)); 
} 
function addY(elem,pos){ 
set(elem,(posY(elem)+pos)); 
} 
//获取元素使用css控制大小的高度和宽度 
function getHeight(elem){ 
return parseInt(getStyle(elem,”height”)); 
} 
function getWidth(elem){ 
return parseInt(getStyle(elem,”width”)); 
} 
//获取元素可能,完整的高度和宽度 
function getFullHeight(elem){ 
if(getStyle(elem,”display”)!=”none”){ 
return getHeight(elem)||elem.offsetHeight; 
}else{ 
var old=resetCss(elem,{display:”block”,visibility:”hidden”,position:”absolute”}); 
var h=elem.clientHeight||getHeight(elem); 
restoreCss(elem,old); 
return h; 
} 
} 
function getFullWidth(elem){ 
if(getStyle(elem,”display”)!=”none”){ 
return getWidth(elem)||elem.offsetWidth; 
}else{ 
var old=resetCss(elem,{display:”block”,visibility:”hidden”,position:”absolute”}); 
var w=elem.clientWidth||getWidth(elem); 
restoreCss(elem,old); 
return w; 
} 
} 
//设置css,并保存旧的css 
function resetCss(elem,prop){ 
var old={}; 
for(var i in prop){ 
old[i]=elem.style[i]; 
elem.style[i]=prop[i]; 
} 
return old; 
} 
function restoreCss(elem,prop){ 
for(var i in prop){ 
elem.style[i]=prop[i]; 
} 
} 
//显示和隐藏 
function show(elem){ 
elem.style.display=elem.$oldDisplay||” “; 
} 
function hide(elem){ 
var curDisplay=getStyle(elem,”display”); 
if(curDisplay!=”none”){ 
elem.$oldDisplay=curDisplay; 
elem.style.display=”none”; 
} 
} 
//设置透明度 
function setOpacity(elem,num){ 
if(elem.filters){ 
elem.style.filter=”alpha(opacity=”+num+”)”; 
}else{ 
elem.style.opacity=num/100; 
} 
} 
//滑动 
function slideDown(elem){ 
var h=getFullHeight(elem); 
elem.style.height=”0px”; 
show(elem); 
for(var i=0;i<=100;i+=5){ 
new function(){ 
var pos=i; 
setTimeout(function(){elem.style.height=(pos/100*h)+”px”;},(pos*10)); 
} 
} 
} 
//渐变 
function fadeIn(elem){ 
show(elem); 
setOpacity(elem,0); 
for(var i=0;i<=100;i+=5){ 
new function(){ 
var pos=i; 
setTimeout(function(){setOpacity(elem,pos);},(pos+1)*10); 
} 
} 
} 
//获取鼠标光标相对于整个页面的位置。 
function getX(e){ 
e=e||window.event; 
return e.pageX||e.clientX+document.body.scrollLeft; 
} 
function getY(e){ 
e=e||window.event; 
return e.pageY||e.clientY+document.body.scrollTop; 
} 
//获取鼠标光标相对于当前元素的位置。 
function getElementX(e){ 
return (e&&e.layerX)||window.event.offsetX; 
} 
function getElementY(e){ 
return (e&&e.layerY)||window.event.offsetY; 
} 
//获取页面的高度和宽度 
function getPageHeight(){ 
var de=document.documentElement; 
return document.body.scrollHeight||(de&&de.scrollHeight); 
} 
function getPageWidth(){ 
var de=document.documentElement; 
return document.body.scrollWidth||(de&&de.scrollWidth); 
} 
//获取滚动条的位置。 
function scrollX(){ 
var de=document.documentElement; 
return self.pageXOffset||(de&&de.scrollLeft)||document.body.scrollLeft; 
} 
function scrollY(){ 
var de=document.documentElement; 
return self.pageYOffset||(de&&de.scrollTop)||document.body.scrollTop; 
} 
//获取视口的高度和宽度。 
function windowHeight() { 
var de = document.documentElement; 
return self.innerHeight||(de && de.offsetHeight)||document.body.offsetHeight; 
} 
function windowWidth() { 
var de = document.documentElement; 
return self.innerWidth||( de && de.offsetWidth )||document.body.offsetWidth; 
}
Javascript 相关文章推荐
js实现简单计算器
Nov 22 Javascript
通过隐藏iframe实现无刷新上传文件操作
Mar 16 Javascript
JavaScript希尔排序、快速排序、归并排序算法
May 08 Javascript
浅谈js中test()函数在正则中的使用
Aug 19 Javascript
轻松实现js选项卡切换效果
Sep 24 Javascript
微信小程序 window_x64环境搭建
Sep 30 Javascript
bootstrap实现动态进度条效果
Mar 08 Javascript
微信小程序 实现动态显示和隐藏某个控件
Apr 27 Javascript
jQuery的ztree仿windows文件新建和拖拽功能的实现代码
Dec 05 jQuery
浅谈Vue.js组件(二)
Apr 09 Javascript
jquery实现二级导航下拉菜单效果实例
May 14 jQuery
vue里使用create, mounted调用方法
Apr 26 Vue.js
JQuery 图片延迟加载并等比缩放插件
Nov 09 #Javascript
让Firefox支持event对象实现代码
Nov 07 #Javascript
extjs DataReader、JsonReader、XmlReader的构造方法
Nov 07 #Javascript
JavaScript 变量基础知识
Nov 07 #Javascript
表格 隔行换色升级版
Nov 07 #Javascript
csdn 论坛技术区平均给分功能
Nov 07 #Javascript
在js中单选框和复选框获取值的方式
Nov 06 #Javascript
You might like
php 静态化实现代码
2009/03/20 PHP
匹配csdn用户数据库与官方用户的重合度并将重叠部分的用户筛选出来
2011/12/25 PHP
解析PHP留言本模块主要功能的函数说明(代码可实现)
2013/06/25 PHP
php通过字符串调用函数示例
2014/03/02 PHP
PHP访问数据库集群的方法小结
2016/03/14 PHP
JQuery 遮罩层实现(mask)实现代码
2010/01/09 Javascript
js中符号转意问题示例探讨
2013/08/19 Javascript
JS两种定义方式的区别、内部原理
2013/11/21 Javascript
javascript函数定义的几种区别小结
2014/01/06 Javascript
jQuery表格插件datatables用法总结
2014/09/05 Javascript
JavaScript极简入门教程(一):基础篇
2014/10/25 Javascript
JavaScript Math.ceil 方法(对数值向上取整)
2015/01/09 Javascript
js控制文本框输入的字符类型方法汇总
2015/06/19 Javascript
基于jQuery实现拖拽图标到回收站并删除功能
2015/11/25 Javascript
Angular.js如何从PHP读取后台数据
2016/03/24 Javascript
Bootstrap提示框效果的实例代码
2017/07/12 Javascript
实现div滚动条默认最底部以及默认最右边的示例代码
2017/11/15 Javascript
Angular封装搜索框组件操作示例
2019/04/25 Javascript
JS操作字符串转数字的常见方法示例
2019/10/29 Javascript
JavaScript队列结构Queue实现过程解析
2020/03/07 Javascript
Django项目中包含多个应用时对url的配置方法
2018/05/30 Python
python 怎样将dataframe中的字符串日期转化为日期的方法
2019/09/26 Python
pycharm 实现调试窗口恢复
2021/02/05 Python
Farfetch美国:奢侈品牌时尚购物平台
2019/05/02 全球购物
最好的商品表达自己:Cafepress
2019/09/04 全球购物
应聘教师自荐信
2013/10/12 职场文书
父亲追悼会答谢词
2014/01/17 职场文书
开展党的群众路线教育实践活动方案
2014/02/05 职场文书
交通事故协议书范文
2014/04/16 职场文书
教师纪念9.18事件演讲稿范文
2014/09/14 职场文书
县委常委班子对照检查材料思想汇报
2014/09/28 职场文书
2015年幼儿园班主任个人工作总结
2015/10/22 职场文书
某学校的2019年度工作报告范本
2019/10/11 职场文书
详解Vue的sync修饰符
2021/05/15 Vue.js
Python 详解通过Scrapy框架实现爬取百度新冠疫情数据流程
2021/11/11 Python
SQL试题 使用窗口函数选出连续3天登录的用户
2022/04/24 Oracle