JavaScriptで要素の高さを揃える（2）

JavaScriptで要素の高さを揃えるというエントリーを書きました。

JavaScriptで要素の高さを揃える - めも帖

使い方を全然書いていませんでした。

概要

JavaScriptは最後に書いています
JavaScriptで、idがtargetIdという要素の中にあるcolumというclassが指定されている要素について高さを取得していき、一番高い要素の値を元に、全部の要素の高さを揃えます

実際のソース全部

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="content-script-type" content="text/javascript">
<script type="text/javascript" charset="UTF-8" src="../prototype.js"></script>
<title>要素の高さを揃える</title>
<style type="text/css">
.colum{
	background-color:#eeeeee;
	margin:1em;
	width:25%;
	padding:1em;
	float:left;
}
</style>

</head>
<body>
<h1>要素の高さを揃える</h1>

<div id="targetId">
	<div class="colum">
	<p>
テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
	</p>
	</div>
	
	<div class="colum">
	<p>
テキストテキストテキストテキスト
	</p>
	</div>
	
	<div class="colum">
	<p>
テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
	</p>
	</div>
</div>

<script type="text/javascript">
function compare(a, b) {
	return a-b;
}

function elementHeight(targetId, targetClass){

	var elements = $(targetId).getElementsByClassName(targetClass);
	var heights  = new Array();
	
	for(var i=0; i<elements.length; i++){
		var height = Element.getHeight(elements[i]);
		heights[i] = height;
	}

	var maxHeight = heights.sort(compare).pop();

	for(var i=0; i<elements.length; i++){
		elements[i].style.height = maxHeight + 'px';
	}
}

window.onload = function(){
	elementHeight('targetId','colum');
}
</script>
</body>
</html>