HTMLPLUS
Version 1.6.1
Github

    HTMLPLUS
    Version 1.6.1
    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.