make-element v2.0.0

make-element

• honeo/make-element
• make-element

なにこれ

引数に合わせて要素を作って返す。

使い方

$ npm i make-element

// Bundle, Node.js
import makeElement from 'make-element';

// CDN
const makeElement = await import('https://cdn.rawgit.com/honeo/make-element/master/index.mjs').then( (mod)=>{
	return mod.default;
});

const anchor = makeElement('a', {href: 'http//example.com/'}, 'Link!');

const span = makeElement('span',
	'classやstyleが複数あればスペースを挟んで統合する。',
	{class: 'foo'}, {class: 'bar'},
	{style: "foo:value;"}, {style: "bar:value;"}
);

const input = makeElement('input', {type: 'button', disabled: true, value: 'Push!'});

const div = makeElement('div', makeElement('span', '引数がNodeなら挿入する。'));

<a href="http//example.com/">Link!</a>

<span class="foo bar" style="foo:value; bar:value;">
	classやstyleが複数あればスペースを挟んで統合する。
</span>

<input type="button" value="Push!" disabled>

<div>
	<span>"引数がNodeなら挿入する。"</span>
</div>

prototype拡張

ご利用は計画的に。

import 'make-element/register.mjs';
const element = document.makeElement('tagName');