介绍 & lt; !DOCTYPE html>
& lt; html>
& lt; head>
& lt;元charset=癠TF-8"祝辞
& lt; style>
身体{
边界:1 px固体红;
填充:10 px;
宽度:300 px;
}
div {
宽度:310 px;
身高:80 px;
粗细:大胆的;
颜色:红色;
字体大小:25 px;
边界:1 px固体红;
可见性:隐藏;/*隐藏元素*/}
& lt;/style>
& lt;/head>
& lt; body>
& lt; div> hello world ! & lt;/div>
& lt; p id=癲emo"祝辞
这里将显示隐藏的" div "元素的高度。
& lt;/p>
& lt;按钮id=癰tn1"祝辞获取高度& lt;/button>
& lt;/body>
& lt;脚本类型=拔谋?javascript"https://www.yisu.com/zixun/src=" . ./演示/js/jquery.min.js ">
<>脚本//jquery代码> $(文档)时(函数(){
$ (“# btn1") .click(函数(){=$ var演示(“div") .innerHeight ();
$ (“# demo")。text(演示);
});
}); $(文档)时(函数(){
$ (“# btn1") .click(函数(){=$ var演示(“div") .outerHeight ();
$ (“# demo")。text(演示);
});
});
这篇文章给大家分享的是有关jQuery获取隐藏元素高度的方法的内容。小编觉得挺实用的,因此分享给大家做个参考。一起跟随小编过来看看吧。
一个HTML元素可以在jQuery的隐藏()函数的帮助下隐藏,或者可以通过在css中使用可见性:隐藏;来轻松隐藏。我们也可以很容易地使用jQuery来找到这个隐藏元素的高度。
每个HTML元素都定义了两种高度,即元素的<代码> innerheight 和<代码> outerheight :
●<代码> innerheight>
●<代码> outerheight>
下面通过代码示例来看看获取这两种高度的方法。
<强>示例1:获取隐藏元素的innerheight高度
HTML代码
jquery代码
输出:
说明:我们使用<代码>高度:80 px;>
<强>示例2:获取隐藏元素的outerHeight高度
jQuery代码
输出:
说明:使用jQuery的outerHeight()函数可以获取的是outerHeight高度,边框宽度将添加到结果中,所以获取的高度为82的。
感谢各位的阅读!关于jQuery获取隐藏元素高度的方法就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到吧!
