jquery元素高度,jq获取div的宽度和高度

jquery获取元素距离浏览器顶部的可视高度

可以使用offset() 方法,该方法返回或设置匹配元素相对于文档的偏移(位置),该方法返回的对象包含两个整型属性:top 和 left,以像素计。此方法只对可见元素有效。

成都创新互联公司长期为上1000家客户提供的网站建设服务,团队从业经验10年,关注不同地域、不同群体,并针对不同对象提供差异化的产品和服务;打造开放共赢平台,与合作伙伴共同营造健康的互联网生态环境。为伍家岗企业提供专业的成都做网站、成都网站建设,伍家岗网站改版等技术服务。拥有10年丰富建站经验和众多成功案例,为您定制开发。

1、使用offset() 方法获取一个元素距离浏览器的顶部和左边的可视距离,代码如下:

html

head

script type="text/javascript" src="/jquery/jquery.js"/script

script type="text/javascript"

$(document).ready(function(){

$("button").click(function(){

x=$("p").offset();

$("#span1").text(x.left);

$("#span2").text(x.top);

});

});

/script

/head

body

p本段落的偏移是 span id="span1"unknown/span left 和 span id="span2"unknown/span top。/p

button获得 offset/button

/body

/html

2、运行的结果如下:

jQuery获取元素宽高

(1)、打点 width()        获取元素的宽

(2)、打点 height()        获取元素的高

(3)、打点 innerWidth()    获取包含内边距和内容区域不包含边框的宽

(4)、打点 innerHeight()    获取包含内边距和内容区域不包含边框的高

(5)、打点 outerWidth()    获取包含内边距、内容区域、边框的宽度

(6)、打点 outerHeight()    获取包含内边距、内容区域、边框的高度

jquery中“outerHeight()”与“height()”的区别是什么?

在jQuery中,获取元素高度的函数有3个,其中有outerHeight()和height()。

1.height():其高度范围是所匹配元素的高度height;height()获取匹配元素集合中的第一个元素的当前计算高度值 或 设置每一个匹配元素的高度值(带一个参数)。

要注意ss('height')和.height()之间的区别是后者返回一个没有单位的数值,前者是返回带有完整单位的字符串。

2.outerheight():其高度范围是所匹配元素的高度。获取元素集合中第一个元素的当前计算高度值,包括padding,border和选择性的margin。返回一个整数(不包含“px”)表示的值 ,或如果在一个空集合上调用该方法,则会返回 null。

outerHeight()函数的返回值为Number类型,返回第一个匹配元素的外高度。返回外高度时,outerHeight()函数只以其中第一个匹配的元素为准。如果没有匹配的元素,则返回null。

jQuery自动获取的高度怎么赋值给元素?

需要准备的材料分别有:电脑、html编辑器、浏览器。

1、首先,打开html编辑器,新建html文件,例如:index.html,并引入jquery。

2、在index.html中的script标签,输入jquery代码:

var btmHeight = $(".bottomBox").height();

$(".footerImgList").css('height', btmHeight - 30 + 'px');

3、浏览器运行index.html页面,此时成功获取到h1标签的高度并减少30后赋值给footerImgList类的元素。

如何用jquery改变元素的高度

xx.height('200px'); //这样就设置了高度为200px,可以不带px----xx.height('200');

jquery如何获取元素的滚动条高度等实现代码

主要功能:

获取浏览器显示区域(可视区域)的高度

$(window).height();

获取浏览器显示区域(可视区域)的宽度

$(window).width();

获取页面的文档高度

$(document).height();

获取页面的文档宽度

$(document).width();

浏览器当前窗口文档body的高度:

$(document.body).height();

浏览器当前窗口文档body的宽度:

$(document.body).width();

获取滚动条到顶部的垂直高度

(即网页被卷上去的高度)

$(document).scrollTop();

获取滚动条到左边的垂直宽度

$(document).scrollLeft();

获取或设置元素的宽度:

$(obj).width();

获取或设置元素的高度:

$(obj).height();

某个元素的上边界到body最顶部的距离:obj.offset().top;(在元素的包含元素不含滚动条的情况下)

某个元素的左边界到body最左边的距离:obj.offset().left;(在元素的包含元素不含滚动条的情况下)

返回当前元素的上边界到它的包含元素的上边界的偏移量:obj.offset().top(在元素的包含元素含滚动条的情况下)

返回当前元素的左边界到它的包含元素的左边界的偏移量:obj.offset().left(在元素的包含元素含滚动条的情况下)

//返回当前页面高度

function

pageHeight(){

if($.browser.msie){

return

document.compatMode

==

"CSS1Compat"?

document.documentElement.clientHeight

:

document.body.clientHeight;

}else{

return

self.innerHeight;

}

};

//返回当前页面宽度

function

pageWidth(){

if($.browser.msie){

return

document.compatMode

==

"CSS1Compat"?

document.documentElement.clientWidth

:

document.body.clientWidth;

}else{

return

self.innerWidth;

}

};

以下是其它网友的补充:

获取浏览器显示区域的高度

$(window).height();

获取浏览器显示区域的宽度

:$(window).width();

获取页面的文档高度

:$(document).height();

获取页面的文档宽度

:$(document).width();

获取滚动条到顶部的垂直高度

:$(document).scrollTop();

获取滚动条到左边的垂直宽度

:$(document).scrollLeft();

计算元素位置和偏移量:$(id).offset();

offset方法是一个很有用的方法,它返回包装集中第一个元素的偏移信息。默认情况下是相对body的偏移信息。结果包含

top和left两个属性。

offset(options,

results)

options.relativeTo指定相对计

算偏移位置的祖先元素。这个元素应该是relative或absolute定位。省略则相对body。

options.scroll是否把

滚动条计算在内,默认TRUE

options.padding是否把padding计算在内,默认false

options.margin

是否把margin计算在内,默认true

options.border是否把边框计算在内,默认true

子页面控制父页面:

parent.document.documentElement.scrollTop;

parent.document.documentElement.clientHeight;


分享标题:jquery元素高度,jq获取div的宽度和高度
标题网址:http://pwwzsj.com/article/dsciosc.html