JavaScript、关于元素的offset~和client~
1、偏移量(offset dimension)
=>offsetLeft(元素距离其父元素左边框(/上边框)的距离)=>offsetTop
=>offsetWidth(元素的宽度/高度,包括元素的内容、内边距和边框)
=>offsetHeight
=>offsetParent(元素的父元素)
2、客户区的大小(client dimension)
=>clientWidth(元素的宽度(/高度),包括元素的内容和内边距)
=>clientHeight
注意:浏览器窗口大小可以使用document.documentElement或document.body(在IE7之前的版本中)
function getViewport() {
if(document.compatMode == "BackCompat"){
return {
width: document.body.clientWidth,
height: document.body.clientHeight
}
}else{
return {
width: document.documentElement.clientWidth,
height: document.documentElement.clientHeight
}
}
}
3、滚动大小(scroll dimension)
=>scrollHeight(滚动内容的实际宽度(高度),在没有滚动条的条件下,元素内容总高度(/宽度))
=>scrollWidth
=>scrollLeft(被隐藏在内容区域左侧(/上方)的像素数,通过这个元素可以改变元素的滚动位置)
=>scrollTop
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步