查看 1333
回复 0
jQuery 遍历 - each() 方法
逆风天

16

主题

0

回帖

105

积分
发表于 2021-12-21 17:59:14
显示全部楼层 阅读模式
本帖最后由 逆风天 于 2021-12-21 18:09 编辑
jQuery 遍历 - each() 方法

假设,一个页面有n个panel元素,如下:
  1. <div class="panel">
  2.   <div class="panel-body"></div>
  3. </div>
  4. <div class="panel">
  5.   <div class="panel-body"></div>
  6. </div>
  7. <div class="panel">
  8.   <div class="panel-body"></div>
  9. </div>
复制代码

然后,每个panel元素下的panel-body元素高度又不一样,那么我们要获取他们的高度,再分别附加到他们身上。这个时候each()方法就好用了。
使用方法如下:
  1. $('.panel>.panel-body').each(function(){
  2.   var Height = $(this).height();
  3.   console.log(Height);
  4. });
复制代码
运行之后控制台中可看到每个panel-body的高度输出。

扩展使用,我在panel-body中做了一些动画,鼠标指向时,panel-body的高度会有变化,于是,就需要以下例子来固定它的高度。
  1. $('.panel>.panel-body').each(function(){
  2.   var Height = $(this).height();
  3.   nft(this).css('height', Height);
  4. });
复制代码
另外,搭配 jQuery 自适应 非常好用。

您需要登录后才可以回帖 登录 立即注册
QQ 快速回复 返回列表