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原型链原理看图说明
Jul 07 Javascript
杨氏矩阵查找的JS代码
Mar 21 Javascript
jquery选择器排除某个DOM元素的方法(实例演示)
Apr 25 Javascript
Android中的jQuery:AQuery简介
May 06 Javascript
jQuery复制表单元素附源码分享效果演示
Sep 30 Javascript
jquery.form.js框架实现文件上传功能案例解析(springmvc)
May 26 Javascript
EasyUi 打开对话框后控件赋值及赋值后不显示的问题解决办法
Jan 19 Javascript
探究react-native 源码的图片缓存问题
Aug 24 Javascript
详解10分钟学会vue滚动行为
Sep 21 Javascript
使用vuepress搭建静态博客的示例代码
Feb 14 Javascript
详解Nuxt内导航栏的两种实现方式
Apr 16 Javascript
VueCli生产环境打包部署跨域失败的解决
Nov 13 Javascript
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中的时间处理
2006/10/09 PHP
PHP实现的链式队列结构示例
2017/09/15 PHP
PHP自动生成缩略图函数的源码示例
2019/03/18 PHP
JavaScript 组件之旅(四):测试 JavaScript 组件
2009/10/28 Javascript
!DOCTYPE声明对JavaScript的影响分析
2010/04/12 Javascript
extjs表格文本启用选择复制功能具体实现
2013/10/11 Javascript
jQuery实现购物车计算价格功能的方法
2015/03/25 Javascript
png在IE6 下无法透明的解决方法汇总
2015/05/21 Javascript
JavaScript通过事件代理高亮显示表格行的方法
2015/05/27 Javascript
简单的jQuery入门指引
2015/07/28 Javascript
JavaScript实现iframe自动高度调整和不同主域名跨域
2016/02/27 Javascript
JavaScript实现为事件句柄绑定监听函数的方法分析
2017/11/14 Javascript
[00:32]DOTA2上海特级锦标赛 Ehome战队宣传片
2016/03/03 DOTA
[43:14]Liquid vs Optic 2018国际邀请赛淘汰赛BO3 第二场 8.21
2018/08/22 DOTA
解析Python中的变量、引用、拷贝和作用域的问题
2015/04/07 Python
详解Python3操作Mongodb简明易懂教程
2017/05/25 Python
python链接oracle数据库以及数据库的增删改查实例
2018/01/30 Python
Python实现图片尺寸缩放脚本
2018/03/10 Python
深入理解Django的中间件middleware
2018/03/14 Python
Python学习笔记之列表推导式实例分析
2019/08/13 Python
wxPython多个窗口的基本结构
2019/11/19 Python
pytorch程序异常后删除占用的显存操作
2020/01/13 Python
python使用建议与技巧分享(二)
2020/08/17 Python
Python实现自动整理文件的脚本
2020/12/17 Python
捷克建筑材料网上商店:DEK.cz
2021/03/06 全球购物
党员公开承诺书范文
2014/03/25 职场文书
2014教师评职称工作总结
2014/11/10 职场文书
纪检部部长竞选稿
2015/11/21 职场文书
煤矿安全生产管理协议书
2016/03/22 职场文书
2016年大学生社区服务活动总结
2016/04/06 职场文书
2019暑假阅读倡议书
2019/06/24 职场文书
2019年个人工作总结范文(3篇)
2019/08/27 职场文书
python文件名批量重命名脚本实例代码
2021/04/22 Python
如何用JavaScript实现一个数组惰性求值库
2021/05/05 Javascript
Python OpenCV超详细讲解基本功能
2022/04/02 Python
vue如何在data中引入图片的正确路径
2022/06/05 Vue.js