$
From WebOS101
Contents |
Introduction
$() is a Prototype helper function that returns the DOM element(s) whose ID matches the argument(s). If one argument is passed, one element is returned. If more than one is passed, an array of elements is returned. This function can also extend an existing DOM element with the Prototype functions if one or more DOM elements are passed as arguments.
$() can be used in Mojo in place of this.controller.get(). Also, using $() to get an element extends that element with Prototype's extra functions.[1]
$() differs from $$() in that the latter searches for CSS selectors.
Example
<div id="my-div"></div>
myDiv = $("my-div");
Use on Multi-Stage Apps
It should be noted that $() only returns elements on the main stage. For instance, if you create a window-less application and dynamically create card stages, $() will not return elements on your created stages. So, if calling $('myDiv') on your dynamically created card stage, it will return null as there isn't an object of that name on the main (invisible) stage. The way around this is to create a global substitute function:
In your AppAssistant:
var _ = function(element) {
var app = Mojo.Controller.getAppAssistant();
var stage = app.getStageController(_.stageName);
return stage.document.getElementById(element);
}
_.stageName="mainStage";
Then, in your app, you can either set _.stageName to a new stage or let it use the default one in the AppAssistant. After setting _.stageName, you can grab an object like this:
_("myDiv")
Which will correctly return the element on the card stage you're using.