js和jq（jquery）方法区分区别3

Posted 2021-04-08 代码笔记本

力             彑

         夂                 小

1. js获取浏览器高度和宽度

document.documentElement.clientWidth ==> 浏览器可见区域宽度 

document.documentElement.clientHeight ==> 浏览器可见区域高度 

document.body.clientWidth ==> BODY对象宽度 

document.body.clientHeight ==> BODY对象高度

Jq获取浏览器高度和宽度

$(window).width() ==> 浏览器可见区域宽度

$(window).height() ==> 浏览器可见区域高度 

$(document).height() ==> 页面文档的高度

$(document.body).height() ==> BODY对象高度

2.Js获取对象的高度和宽度

obj.width = obj.style.width

obj.clientWidth = width + padding   ==> 获得包括内边界（padding）的元素宽度

obj.offsetHeight = height + padding + border ==> 获得包括内边界(padding)和边框(border)的元素高度

Jq获取对象的高度和宽度

obj.innerWidth() ==> 获得包括内边界（padding）的元素宽度，

obj.outerWidth() ==> 获得包括内边界(padding)和边框(border)的元素宽度

obj.outerWidth(true) ==> 获得包括外边界(margin)的元素宽度

w同一个元素应该是：width()<=innerWidth()<=outerWidth()<=outerWidth(true);

3.Js 获取对象的相对高度和宽度

obj.offsetLeft ==> 元素相对于父元素的left

obj.offsettop ==> 元素相对于父元素的top

obj.scrollWidth ==> 获取对象的滚动宽度

obj.scrollHeight ==> 获取对象的滚动高度 

obj.scrollLeft ==> 设置或获取位于对象左端滚动的距离

obj.scrollTop ==> 设置或获取位于对象顶端滚动的距离

Jq 获取对象的相对高度和宽度

obj.offset().left ==> 元素相对于文档的left

obj.offset().top ==> 元素相对于文档的top

obj.scrollLeft() ==> 设置或返回对象相对滚动条左侧的偏移。

obj.scrollTop() ==> 设置或返回对象相对滚动条顶部的偏移。

代码笔记本

每天记录学习历程