Jquery作者John Resig自己封裝的javascript 常用函數(shù)
更新時(shí)間:2009年11月09日 16:33:54 作者:
Jquery作者John Resig自己封裝的常用函數(shù), 大家可以參考下。
復(fù)制代碼 代碼如下:
//獲取元素的樣式值。
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
}
}
//獲取元素相對(duì)于這個(gè)頁(yè)面的x和y坐標(biāo)。
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;
}
//獲取元素相對(duì)于父元素的x和y坐標(biāo)。
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坐標(biāo)。
function posX(elem){
return parseInt(getStyle(elem,”left”));
}
function posY(elem){
return parseInt(getStyle(elem,”top”));
}
//設(shè)置元素位置。
function setX(elem,pos){
elem.style.left=pos+”px”;
}
function setY(elem,pos){
elem.style.top=pos+”px”;
}
//增加元素X和y坐標(biāo)。
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;
}
}
//設(shè)置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”;
}
}
//設(shè)置透明度
function setOpacity(elem,num){
if(elem.filters){
elem.style.filter=”alpha(opacity=”+num+”)”;
}else{
elem.style.opacity=num/100;
}
}
//滑動(dòng)
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);
}
}
}
//獲取鼠標(biāo)光標(biāo)相對(duì)于整個(gè)頁(yè)面的位置。
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;
}
//獲取鼠標(biāo)光標(biāo)相對(duì)于當(dāng)前元素的位置。
function getElementX(e){
return (e&&e.layerX)||window.event.offsetX;
}
function getElementY(e){
return (e&&e.layerY)||window.event.offsetY;
}
//獲取頁(yè)面的高度和寬度
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);
}
//獲取滾動(dòng)條的位置。
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;
}
您可能感興趣的文章:
- jQuery常用知識(shí)點(diǎn)總結(jié)以及平時(shí)封裝常用函數(shù)
- 基于jquery封裝的一個(gè)js分頁(yè)
- jquery數(shù)組封裝使用方法分享(jquery數(shù)組遍歷)
- Jquery封裝tab自動(dòng)切換效果的具體實(shí)現(xiàn)
- jquery自動(dòng)將form表單封裝成json的具體實(shí)現(xiàn)
- jquery datatable后臺(tái)封裝數(shù)據(jù)示例代碼
- jQuery焦點(diǎn)圖切換特效插件封裝實(shí)例
- 基于jquery的用dl模擬實(shí)現(xiàn)可自定義樣式的SELECT下拉列表(已封裝)
- jQueryUI的Dialog的簡(jiǎn)單封裝
- 【經(jīng)典源碼收藏】基于jQuery的項(xiàng)目常見(jiàn)函數(shù)封裝集合
相關(guān)文章
javascript設(shè)計(jì)模式 – 代理模式原理與用法實(shí)例分析
這篇文章主要介紹了javascript設(shè)計(jì)模式 – 代理模式,結(jié)合實(shí)例形式分析了javascript代理模式相關(guān)概念、原理、用法及操作注意事項(xiàng),需要的朋友可以參考下2020-04-04
JavaScript中this的全面解析及常見(jiàn)實(shí)例
這篇文章主要給大家介紹了關(guān)于JavaScript中this的全面解析及常見(jiàn)實(shí)例的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用JavaScript具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
js parseInt("08")未指定進(jìn)位制問(wèn)題
今天在做JS關(guān)于月份的判斷,對(duì)于parseInt("01")到parseInt("07");都能得到正確的結(jié)果,但如果是parseInt("08")或parseInt("09")則返回0,首先看parseInt語(yǔ)法:parseInt(string, radix);2010-06-06
JS實(shí)現(xiàn)電影票選座的項(xiàng)目示例
電影院選座基本上每個(gè)人都用到過(guò),本文主要介紹了JS實(shí)現(xiàn)電影票選座的項(xiàng)目示例,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-04-04
JavaScript實(shí)現(xiàn)動(dòng)態(tài)刪除列表框值的方法
這篇文章主要介紹了JavaScript實(shí)現(xiàn)動(dòng)態(tài)刪除列表框值的方法,涉及javascript針對(duì)select列表框的遍歷與刪除操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08
詳解JavaScript中的類(lèi)型判斷與類(lèi)型轉(zhuǎn)換
這篇文章主要給大家講解一下JavaScript中的類(lèi)型判斷與類(lèi)型轉(zhuǎn)換的基本概念和使用方法,對(duì)我們的學(xué)習(xí)JavaScript的類(lèi)型判斷與轉(zhuǎn)換有一定的幫助,需要的朋友可以參考下2023-07-07

