本帖最后由 逆风天 于 2021-12-21 18:09 编辑
假设,一个页面有n个
panel元素,如下:
- <div class="panel">
- <div class="panel-body"></div>
- </div>
- <div class="panel">
- <div class="panel-body"></div>
- </div>
- <div class="panel">
- <div class="panel-body"></div>
- </div>
复制代码
然后,每个
panel元素下的
panel-body元素高度又不一样,那么我们要获取他们的高度,再分别附加到他们身上。这个时候
each()方法就好用了。
使用方法如下:
- $('.panel>.panel-body').each(function(){
- var Height = $(this).height();
- console.log(Height);
- });
复制代码运行之后控制台中可看到每个
panel-body的高度输出。
扩展使用,我在
panel-body中做了一些动画,鼠标指向时,
panel-body的高度会有变化,于是,就需要以下例子来固定它的高度。
- $('.panel>.panel-body').each(function(){
- var Height = $(this).height();
- nft(this).css('height', Height);
- });
复制代码另外,搭配
jQuery 自适应 非常好用。