ToElement

docs

MooTools has a not-well-known shortcut for its classes that allows you to pass an instance of a class to $ and have it return the DOM element to which the class is applied. This doesn't always make sense. While Fx.Tween obviously only points to a single DOM element, Accordion does not.

When it does make sense, to make the trick work you just define a method called toElement in your class that returns the element you want $ to fetch when you pass it an instance of your class.

Here's a simple example:

var Widget = new Class({
	initialize: function(element){
		this.element = $(element);
	},
	toElement: function(){
		return this.element;
	}
});
 
var myWidget = new Widget($('demo'));
//$(myWidget) == $('demo')

This class just includes that toElement method for you. In order for it to work, you must assign the element you want returned as this.element. Here's the same class above using the ToElement mixin:

var Widget = new Class({
	Implements: [ToElement],
	initialize: function(element){
		this.element = $(element);
	}
});
 
var myWidget = new Widget($('demo'));
//$(myWidget) == $('demo')