将所有元素设置为集合中最宽的宽度

Question

我有一些宽度不同的元素。我需要循环每个，找到最宽的宽度并将所有宽度设置为。

<div id="mySet">
    <span>some content</span>
    <span>more content</span>
    <span>here content</span>
</div>

JS：

var widest = 0;

$("#mySet span").each(function(){
   var this = $(this),
       wdth = this.width();

   if(wdth > widest ){
       widest = wdth;

       $("#mySet span").each(function(){
           $(this).width(widest);
       });
   }

});

我想我可以获得最大宽度，但每次都要循环为每个元素指定宽度。似乎有太多的循环。

Answer 1

要将宽度设置为span，您只需要

$("#mySet span").width(widest);

这会将宽度设置为全部。所以把它放在循环之外和最后。

Answer 2

循环以获得最宽的替代方法：

// Using modern JavaScript:
const widest = Math.max(...$("#mySet span").map((i, span) => $(span).width()));

// Using older JavaScript:
var widest = Math.max.apply(
  null,
  $("#mySet span").map(function() {
    return $(this).width();
  })
);

然后$("#mySet span").width(widest);一次性设置所有跨度的宽度。