https://github.com/neknaj/cdom

javascriptで簡単にDOMを生成するためのライブラリ
https://github.com/neknaj/cdom

dom javascript-library

Last synced: 13 days ago
JSON representation

javascriptで簡単にDOMを生成するためのライブラリ

• Host: GitHub
• URL: https://github.com/neknaj/cdom
• Owner: neknaj
• License: mit
• Created: 2024-04-03T17:04:35.000Z (10 months ago)
• Default Branch: main
• Last Pushed: 2025-01-18T09:40:11.000Z (13 days ago)
• Last Synced: 2025-01-18T10:27:45.505Z (13 days ago)
• Topics: dom, javascript-library
• Language: JavaScript
• Homepage: https://neknaj.github.io/cDom/
• Size: 16.6 KB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        


    
cDom.js

    
vanilla-jsで簡単にDOMを作りたいので片手間に作ったライブラリです。cDomはcreate-DOMの略です。

このライブラリを使うことで、document.createElement()とelement.setAttribute()とelement.appendChild()を書き続ける苦痛から解放されます。



## サンプルコード

index.html

```html

cDom Sample Page

function main() {

    // DOMを生成する

    const dom = elm("div",{width:100,height:30},[

        elm("h1",{},[textelm("cDom.js")]),

        elm("p",{},[

            elm("span",{},[textelm("vanilla-jsで簡単にDOMを作りたいので片手間に作ったライブラリです。")]),

            elm("span",{},[textelm("cDomはcreate-DOMの略です。")]),

        ]),

        elm("p",{},[

            textelm("このライブラリを使うことで、"),

            elm("code",{},[textelm("document.createElement()")]),

            textelm("と"),

            elm("code",{},[textelm("element.setAttribute()")]),

            textelm("と"),

            elm("code",{},[textelm("element.appendChild()")]),

            textelm("を書き続ける苦痛から解放されます。"),

        ]),

        elm("h2",{},[textelm("サンプルコード")]),

        elm("p",{},[

            elm("code",{},[elm("pre",{},[textelm(main.toString())])]),

        ]),

    ]);

    // DOMを追加する

    document.body.appendChild(dom);

}

window.onload = main;

```

## ライセンス

[MITライセンス](LICENSE) 又は [CC0](https://creativecommons.org/publicdomain/zero/1.0/)  

どちらででもご利用下さい