精通JavaScript源码2

hrsvici412

// Find the left position of an elementfunction posX(elem) {    // Get the computed style and get the number out of the value    return parseInt( getStyle( elem, “left” ) );}// Find the top position of an elementfunction posY(elem) {    // Get the computed style and get the number out of the value    return parseInt( getStyle( elem, “top” ) );} 获取style指定elem的值:
function getStyle( elem, name ) {    if (elem.style[name])        return elem.style[name];     //IE中的方法    else if (elem.currentStyle)        return elem.currentStyle[name];    // W3C的方法    else if (document.defaultView && document.defaultView.getComputedStyle) {        // It uses the traditional ‘text-align’ style of rule writing, instead of textAlign        name = name.replace(/([A-Z])/g,"-$1");        name = name.toLowerCase();        // Get the style object and get the value of the property (if it exists)        var s = document.defaultView.getComputedStyle(elem,"");        return s && s.getPropertyValue(name);    } else        return null;}找到elem在页面中水平X（left），垂直Y的值（top），offsetLeft方法在不同的浏览器有所不同。
// Find the X (Horizontal, Left) position of an elementfunction pageX(elem) {    var p = 0;    // We need to add up all of the offsets for every parent    while ( elem.offsetParent ) {        // Add the offset to the current count        p += elem.offsetLeft;        // and continue on to the next parent        elem = elem.offsetParent;    }    return p;}// Find the Y (Vertical, Top) position of an elementfunction pageY(elem) {    var p = 0;    // We need to add up all the offsets for every parent    while ( elem.offsetParent ) {        // Add the offset to the current count        p += elem.offsetTop;        // and continue on to the next parent        elem = elem.offsetParent;    }    return p;} 找到elem距离去父元素的位置：
// Find the horizontal positioing of an element within its parentfunction parentX(elem) {    // If the offsetParent is the element’s parent, break early    return elem.parentNode == elem.offsetParent ?        elem.offsetLeft :        // Otherwise, we need to find the position relative to the entire        // page for both elements, and find the difference        pageX( elem ) - pageX( elem.parentNode );}// Find the vertical positioing of an element within its parentfunction parentY(elem) {    // If the offsetParent is the element’s parent, break early    return elem.parentNode == elem.offsetParent ?        elem.offsetTop :        // Otherwise, we need to find the position relative to the entire        // page for both elements, and find the difference        pageY( elem ) - pageY( elem.parentNode );} 找到elem中style中left，top的值：
// Find the left position of an elementfunction posX(elem) {    // Get the computed style and get the number out of the value    return parseInt( getStyle( elem, “left” ) );}// Find the top position of an elementfunction posY(elem) {    // Get the computed style and get the number out of the value    return parseInt( getStyle( elem, “top” ) );} 设置elem left，top的值：
// A function for setting the horizontal position of an elementfunction setX(elem, pos) {    // Set the ‘left’ CSS property, using pixel units    elem.style.left = pos + “px”;}// A function for setting the vertical position of an elementfunction setY(elem, pos) {    // Set the ‘left’ CSS property, using pixel units    elem.style.top = pos + “px”;}// A function for adding a number of pixels to the horizontal// position of an element function addX(elem,pos) {    // Get the current horz. position and add the offset to it.    setX( posX(elem) + pos );}// A function that can be used to add a number of pixels to the// vertical position of an elementfunction addY(elem,pos) {    // Get the current vertical position and add the offset to it    setY( posY(elem) + pos );}  获得元素的width，height，隐藏的元素是不可以获得width和height，可以用fullHeight，fullWidth实现：
// Get the actual height (using the computed CSS) of an elementfunction getHeight( elem ) {    // Gets the computed CSS value and parses out a usable number    return parseInt( getStyle( elem, ‘height’ ) );}// Get the actual width (using the computed CSS) of an elementfunction getWidth( elem ) {    // Gets the computed CSS value and parses out a usable number    return parseInt( getStyle( elem, ‘width’ ) );}// Find the full, possible, height of an element (not the actual,// current, height)function fullHeight( elem ) {    // If the element is being displayed, then offsetHeight    // should do the trick, barring that, getHeight() will work    if ( getStyle( elem, ‘display’ ) != ‘none’ )        return elem.offsetHeight || getHeight( elem );    // Otherwise, we have to deal with an element with a display    // of none, so we need to reset its CSS properties to get a more    // accurate reading    var old = resetCSS( elem, {        display: ‘’,        visibility: ‘hidden’,        position: ‘absolute’    });    // Figure out what the full height of the element is, using clientHeight    // and if that doesn’t work, use getHeight    var h = elem.clientHeight || getHeight( elem );    // Finally, restore the CSS properties back to what they were    restoreCSS( elem, old );    // and return the full height of the element    return h;}// Find the full, possible, width of an element (not the actual,// current, width)function fullWidth( elem ) {    // If the element is being displayed, then offsetWidth    // should do the trick, barring that, getWidth() will work    if ( getStyle( elem, ‘display’ ) != ‘none’ )        return elem.offsetWidth || getWidth( elem );    // Otherwise, we have to deal with an element with a display    // of none, so we need to reset its CSS properties to get a more    // accurate reading    var old = resetCSS( elem, {        display: ‘’,        visibility: ‘hidden’,        position: ‘absolute’    });    // Figure out what the full width of the element is, using clientWidth    // and if that doesn’t work, use getWidth    var w = elem.clientWidth || getWidth( elem );    // Finally, restore the CSS properties back to what they were    restoreCSS( elem, old );    // and return the full width of the element    return w;}// A function used for setting a set of CSS properties, which// can then be restored back again laterfunction resetCSS( elem, prop ) {    var old = {};    // Go through each of the properties    for ( var i in prop ) {        // Remember the old property value        old[ i ] = elem.style[ i ];        // And set the new value        elem.style[ i ] = prop;    }    // Retun the set of changed values, to be used by restoreCSS    return old;}// A function for restoring the side effects of the resetCSS functionfunction restoreCSS( elem, prop ) {    // Reset all the properties back to their original values    for ( var i in prop )        elem.style[ i ] = prop[ i ];