HTMLPLUS
Version 1.7.3
Github

    JavaScript

    HTMLPLUS elements are fully compatible with JavaScript. To utilize elements in your JavaScript application follow these steps.

    Import

    You can utilize HTMLPLUS simply by adding a simple scirpt in your main html like this.

    <!DOCTYPE html> <html> <head> <title>HTMLPLUS in JavaScript</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <plus-switch></plus-switch> <script type="module"> import "https://esm.run/@htmlplus/ui"; </script> </body> </html>

    JavaScript modules via script tag just work on modern browsers. It's not compatible with some browsers click here to check compatibility.

    Attributes

    To set attribute.

    <plus-switch disabled></plus-switch>

    Properties

    To set property. All Standard JavaScript APIs are supported. Feel free to use them.

    <plus-switch id="element"></plus-switch> <script> element.disabled = true; </script>

    Events

    To add event to elements you can use this format.

    <plus-switch id="element"></plus-switch> <script> element.addEventListener('plus-change', () => { alert('The event fired!'); }) </script>

    Most of events such as click and change, etc. are prereserved by explorers. To avoid conflict occuring you need to use plus- prefix.