Native jQuery JS and the offset, client, scroll Comparative

Primeval

the offsetTop     // Get distance position with a positioning element of the parent element (not places body) 
the offsetLeft
offsetWidth    // Get the size of the element itself (width and height) of the border and comprises padding 
the offsetHeight
the offsetParent     // Returns the parent box is not located with a body 
                // return value without units


clientTop   // return the element's border size 
clientLeft // Returns the element's left border size 
clientWidth // include padding the return value does not include the border without units 
clientHeight // height


document.documentElement.scrollTop    // return the volume to a height, without units // readable and writable 
document.documentElement.scrollLeft
document.documentElement.scrollWidth   // return their actual width (rolling width), chromeless, no units 
document.documentElement.scrollHeight  

window.pageYOffset   // page // rolled to read but not write 
window.pageXOffset

window.scroll (X, Y) // Scroll window to a specific location in the document 
window.scroll (0, 100) // without waste unit has been scrollTo @ Alternatively 
the window.scrollTo () //


The difference between offset and style of the series
style can only get inline styles, css styles can not get inside, so if I did not write in the rows, get less
style is readable and writable. offset is read-only.
offset is obtained without units. style is obtained with units
offset obtained with padding and border, and style acquired without

 

 

jQuery

width ()     // count only when the width of the read-write unit can not strip 
height ()

innerWidth()   //包括padding
innerHeight()

outerWidth()    //包括border
outerHeight()

outerWidth(true)   //包括margin
outerHeight(true)


offset ()   // Sets or gets the element offset with respect to the document, there is no relationship with the parent can not write // // read-write unit returns an object, which has left and Top 
position () // relative parent positioned with an offset to. No parent document is read but not write // 
scrollTop () // rolled read highly readable and writable //   
// The following three methods can be 
// $ (Document) .scrollTop (100) $ (window ) .scrollTop (100) $ (document.documentElement ) .scrollTop (100)

// Note that only a scrollTop property in document.documentElement object. The volume height is to be read 
            // so use $ () Animate ({}), $ ( 'HTML') Animate ({scrollTop: 1000}, 3000).. 
The scrollLeft ()

 

 

Event event

e.clientX // relative to the window of the X- 
e.clientY //
 e.pageX   // relative to the document page 
e.pageY //
 e.screenX // relative to the computer screen 
e.screenY
e.offsetX // relative to the current element clicked 
e.offsetY

 

 

Guess you like

Origin www.cnblogs.com/flyerya/p/11696063.html