質問:
jQuery または CSS をどのように使用すればよいでしょうか要素のグループ (DIV) の最も高いものを決定し、それらをすべて同じに設定します。 height?
jQuery を使用した解決策:
$(document).ready(function() { var maxHeight = -1; $('.features').each(function() { maxHeight = maxHeight > $(this).height() ? maxHeight : $(this).height(); }); $('.features').each(function() { $(this).height(maxHeight); }); });
バージョン 2 (関数型プログラミングを使用したよりクリーンな):
$(document).ready(function() { var maxHeight = Math.max.apply(null, $('.features').map(function() { return $(this).height(); }).get()); $('.features').height(maxHeight); });
バニラ JavaScript を使用したソリューション (なし) jQuery):
var elements = document.getElementsByClassName('features'); var maxHeight = Math.max.apply(null, Array.prototype.map.call(elements, function(el) { return el.clientHeight; })); Array.prototype.forEach.call(elements, function(el) { el.style.height = maxHeight + "px"; });
ES6 の使用:
const elements = document.getElementsByClassName('features'); const maxHeight = Math.max(...Array.from(elements).map(el => el.clientHeight)); elements.forEach(el => el.style.height = `${maxHeight}px`);
結論:
これらのメソッドを効果的に使用するjQuery、バニラを使用して、内容に関係なく、一連の DIV の高さが同じであることを確認します。 JavaScript または ES6。
以上がjQueryまたはCSSを使用してグループ内のすべての要素を同じ高さにする方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。