jsjq：获取div的宽度、高度、屏幕距离方法总结

jq获取div的宽度

只是获取content宽度
var content = $(‘div’). width();
获取content+padding的宽度
var contentWithPadding = $(‘div’). innerWidth();
获取content+padding+border的宽度
var withoutMargin = $(‘div’). outerWidth();
获取content+padding+border+margin的宽度
var full = $(‘div’). outerWidth(true);

注：Margin 有个特色，就是当两个有 margin的 div 靠在一起时，两个 div 紧邻的 margin 不是相加，而是取其大者。
eg：两个 10px margin 的 div 并在一起==> 10px margin 的距离。
一个 20px margin，另一个为 10px margin==> 20px 的 margin。

但是获取当前元素的全部宽度的时候，还是获取自身的margin+content+padding+border的值

jq获取屏幕距离

文档窗口高度
$(window).height();
标签距离顶部高度（没有到下面的距离$(“div”).offset().down）
$("div").offset().top;
是标签距离右边高度（没有到下面的距离，$(“div”).offset().right）
$("div").offset().left;
滚动条高度
$(document).scrollTop();
标签高度
$("div").height();

js获取div的高度

var div = document.getElementById("div");

可视内容高度
var clientHeight = div.clientHeight;
占据页面总高度
var offsetHeight = div.offsetHeight;
展开滚动内容总高度
var scrollHeight = div.scrollHeight;
屏幕宽度
var screenWidth = window.screen.width;

js获取屏幕距离

var div = document.getElementById(obj);

div离屏幕上边距离(长度)
var topLength = div.getBoundingClientRect().top;
div离屏幕下边距离(长度)
var bottomLength = div.getBoundingClientRect().bottom;
div离屏幕左边距离(长度)
var leftLength = div.getBoundingClientRect().left;
div离屏幕右边距离(长度)
var rightLength = div.getBoundingClientRect().right;

jsjq：获取div的宽度、高度、屏幕距离方法总结相关推荐

获取div的宽度和高度
获取div的宽度和高度我最先开始的想法是这样的获取到div var d = document.getElementById("容器id") 取widthd.width,或者d. ...
JS动态获取DIV的宽度和高度px！
JS动态获取div的宽度: var o = document.getElementById("div"); var width= o.clientWidth||o.offsetWi ...
图片加尺寸php代码,php获取图片尺寸(宽度,高度)_php
本篇文章主要说明php获取图片尺寸(宽度,高度)的函数,即getimagesize()函数. 语法:array getimagesize( string filename [, array & ...
获取手机宽度高度dpr的方法
获取手机宽度高度dpr的方法引言在做uni-app小程序.app或者h5的时候,默认的手机尺寸基本上是iphone,和安卓机不太一样. 所以我们需要获取自己手机的宽度高度,方法如下打开HBuil ...
js获取DIV的位置坐标的三种方法！
js获取DIV的位置坐标的三种方法! 方法一: var odiv=document.getElementById('divid'); alert(odiv.getBoundingClientRect( ...
html页面撑满整屏幕,让div撑满整个屏幕的方法（css）
这篇文章主要介绍了关于让div撑满整个屏幕的方法(css),有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下在body只有一个p的时候,可以通过这样的方式让p撑满整个屏幕. 1.给p设置 ...
获取div的各种高度
1.获取div的文档总高度(必须DOM操作): var scrollHeight=document.getElementById("inner").scrollHeight;// ...
php 获得图片大小,php获取图片尺寸(宽度,高度)
本篇文章主要说明PHP获取图片尺寸(宽度,高度)的函数,即getimagesize()函数. 语法:array getimagesize( string filename [, array & ...
vue如何获取div的宽度_vue获取dom元素高度的方法
获取DOM高度: 要在钩子mounted里面dom结构生成后去获取dom的高度,宽度,修改样式等操作(参照生命周期钩子mounted语法:https://cn.vuejs.org/v2/api/#mo ...