Creates a native DOM Element, adds it to the parent DOM Container and then binds it to this Game Object,
so you can control it. The tagName
should be a string and is passed to document.createElement
:
this.add.dom().createElement('div');
For more details on acceptable tag names see: https://developer.mozilla.org/en-US/docs/Web/API/Document/createElement
You can also pass in a DOMString or style object to set the CSS on the created element, and an optional innerText
value as well. Here is an example of a DOMString:
this.add.dom().createElement('div', 'background-color: lime; width: 220px; height: 100px; font: 48px Arial', 'Phaser');
And using a style object:
var style = {
'background-color': 'lime';
'width': '200px';
'height': '100px';
'font': '48px Arial';
};
this.add.dom().createElement('div', style, 'Phaser');
If this Game Object already has an Element, it is removed from the DOM entirely first. Any event listeners you may have previously created will need to be re-created after this call.
name | type | arguments | description |
---|---|---|---|
tagName | string |
A string that specifies the type of element to be created. The nodeName of the created element is initialized with the value of tagName. Don't use qualified names (like "html:a") with this method. |
|
style | string | any | <optional> |
Either a DOMString that holds the CSS styles to be applied to the created element, or an object the styles will be ready from. |
innerText | string | <optional> |
A DOMString that holds the text that will be set as the innerText of the created element. |
This DOM Element instance.