prototype.js分析

Element.setStyle

  • prototypeオブジェクトはnewしないとアクセスできないので、createとテスト用のiteratorは別個に拡張する。

参考サイト

http://www.thinkit.co.jp/cert/article/0702/15/7/2.htm

<script src="./prototype1.6.js"></script> 
<script>
var Box = Class.create();
Box.prototype = {
	initialize : function(elem, opts){
		this.elem = $(elem);
		//alert(this.elem);
		//alert(this.elem.nodeName);

		Element.setStyle(this.elem, {
			"border" : "solid 1px",
			"background" : "#ccccff",
			"width" : "100px",
			"height" : "100px"
		});
	}
}
Object.extend(Box, {
	create : function(elem, opts){
		return new Box(elem, opts);
	},
	iterator : function(value, index){
		return index + " : " + value + " -> これはテストです\n";
	}
});

function test(){
	var divs;
	divs = $$('.test').collect(Box.create);
}
function test2(){
	alert($$('.test').collect(Box.iterator));
}
</script>
<div class="test">aaa</div><br>
<div class="test">bbb</div><br>
<input type="button" value="Box.create" onclick="test()">
<input type="button" value="Box.iterator" onclick="test2()">