博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
封装的一些常用的javascript函数
阅读量:5873 次
发布时间:2019-06-19

本文共 4316 字,大约阅读时间需要 14 分钟。

hot3.png

//获取元素的样式值。 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;}

转载于:https://my.oschina.net/1067377855/blog/410856

你可能感兴趣的文章
PgSQL · 应用案例 · 海量用户实时定位和圈人-团圆社会公益系统
查看>>
leetcode二分查找问题整理
查看>>
设计模式——8代理模式(Proxy)
查看>>
Data Guard故障自动切换的想法(r11笔记第40天)
查看>>
调查显示:1/3的“00后”希望人工智能和机器人领导国家
查看>>
C++异常处理与临时副本
查看>>
[绝对原创] SAP Get User data by User ID
查看>>
WPF笔记(2.2 DockPanel)——Layout
查看>>
嵌入式工控机主板在无人机中的应用
查看>>
后台(22)——AJAX
查看>>
LVM pvcreate,vgcreate,lvcreate,mkfs
查看>>
DeepMind提出快速调参新算法PBT,适用GAN训练(附论文)
查看>>
深入浅出JVM
查看>>
【NIPS2017现场+数据也疯狂】最佳论文大奖公布,算法关注度超越深度学习排第一...
查看>>
MyBatis实现SaveOrUpdate
查看>>
WPF动态加载3D&nbsp;放大-旋转-平移
查看>>
Spring Boot工程支持HTTP和HTTPS,HTTP重定向HTTPS
查看>>
[20170324]dg相关进程.txt
查看>>
DataTable 更改在有数据列的类型方法
查看>>
nginx做本地目录映射
查看>>