Js与Jq 获取页面元素值的方法和差异对比
JS与Jquery都能获取页面元素的宽度,高度和相对位移等数值,那他们之间能相互转换或替代吗,写法又有哪些差异呢?本文将详细为你介绍。
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() ==>设置或返回对象相对滚动条顶部的偏移。
以上所述就是本文的全部内容了,希望大家能够喜欢。