JS| class extends Dom

[michael solomon]

Hi,
it's possible that class will extends js.html.HTMLElement(or Element or DivElement...)?
http://try.haxe.org/#6Ea7C

[Domagoj Štrekelj]

Hello,

I guess you can extended it, but I don't think you'll gain much doing so. As far as I'm aware these classes don't have constructors - element creation is done through document.createElement() and similar methods. Unless you're somehow able to specify that you want to create an element from your custom class, you'll probably have to resort to something slightly hacky with abstracts. For example:

class Test {
    static function main() {
        var c = new Custom('Hello from the custom div element!');
        js.Browser.document.body.appendChild(c);
    }
}

abstract Custom (js.html.DivElement) from js.html.DivElement to js.html.DivElement {
    public function new(message : String) {
        this = js.Browser.document.createDivElement();
        this.appendChild(js.Browser.document.createTextNode(message));
    }
}

The reason why you'd want to use an abstract instead of a class is because you're able to modify the this reference and cast your element into any element you wish (a DivElement in this case). I believe you could also create a class that extends an element class and use it as a base for the abstract, and then cast the abstract to the superclass. However, that seems like unnecessary overhead.

You can try the above code here: http://try.haxe.org/#D2E7C

Another thing that comes to mind is the creation of 'truly' custom elements that have their own custom HTML tags. However, I'd advise against it because of the lack of support. If you're interested you can read up more on custom elements here and here.

[Itzik Arzoni]

Hi, maybe you can provide some information about what you're trying to implement.
It seems that you're searching for something similar to the Doom library?
https://groups.google.com/d/topic/haxelang/t1zU9UwkZOY/discussion

[Cambiata]

Haxe-dom (hxdom) might be a solution:
https://github.com/Blank101/haxe-dom

Here's an example:
https://github.com/cambiata/haxe-dom/blob/master/example/src/Components.hx

[michael solomon]

Thanks guys, the abstract goes well :)