原生 JS 和 jQuery 中的尺寸
element
| jQuery | JS |
|---|---|
| $(elem).width() | border-box: elem.offsetWidth - padding - border content-box: elem.offsetWidth - padding |
| $(elem).innerWidth() | elem.clientWidth + scrollbar |
| $(elem).outerWidth() | elem.offsetWidth |
window
| jQuery | JS |
|---|---|
| $(window).width() | document.documentElement.clientWidth |
| $(window).innerWidth() | document.documentElement.clientWidth |
| $(window).outerWidth() | window.innerWidth |
document
| jQuery | JS |
|---|---|
| $(document).width() | Math.max(document.body.scrollWidth, document.documentElement.scrollWidth, document.body.offsetWidth, document.documentElement.offsetWidth, document.documentElement.clientWidth) |
| $(document).innerWidth() | ? |
| $(document).outerWidth() | ? |
感謝您的閱讀，如果您對我的文章感興趣，可以關注我的博客，我是敘帝利，下篇文章再見！
高顏值的漸變編輯器組件，支持所有 CSS 漸變語法 https://github.com/acrodata/gradient-picker
低代碼平臺必備輕量級 GUI 庫 https://github.com/acrodata/gui
適用于 Angular 的 CodeMirror 6 組件 https://github.com/acrodata/code-editor
適用于 Angular 的水印組件（防刪除，盲水印） https://github.com/acrodata/watermark
支持拖拽和縮放的彈窗組件 https://github.com/acrodata/rnd-dialog
開發低代碼平臺的必備拖拽庫 https://github.com/ng-dnd/ng-dnd
基于 Angular Material 的中后臺管理框架 https://github.com/ng-matero/ng-matero
Angular Material Extensions 擴展組件庫 https://github.com/ng-matero/extensions
Unslider 輪播圖插件純 JS 實現 https://github.com/nzbin/unsliderjs
仿 Windows 照片查看器插件 https://github.com/nzbin/photoviewer
仿 Windows 照片查看器插件 jQuery 版 https://github.com/nzbin/magnify
完美替代 jQuery 的模塊化 DOM 庫 https://github.com/nzbin/domq
簡化類名的輕量級 CSS 框架 https://github.com/nzbin/snack
與任意 UI 框架搭配使用的通用輔助類 https://github.com/nzbin/snack-helper
單元素純 CSS 加載動畫 https://github.com/nzbin/three-dots
有趣的 jQuery 卡片抽獎插件 https://github.com/nzbin/CardShow
懸疑科幻電影推薦 https://github.com/nzbin/movie-gallery
鍛煉記憶力的小程序 https://github.com/nzbin/memory-stake
浙公網安備 33010602011771號