Create HTML DOMs quickly.

domObjectCreator.js

const dobj = function(tag, names, inner, children, ...moreProps) {
	let newOne = document.createElement(tag);
	
	if(names) {
		if(names.constructor===Array) {
			names[0]?newOne.className = names[0]:"";
			names[1]?newOne.id = names[1]:"";
		} else
			newOne.className = names;
	}
	
	inner? newOne.innerHTML = inner:"";
	
	newOne.appendChildren = function(c) {
		for(let i in arguments)
			newOne.appendChild(arguments[i]);
	};
	
	if(children) {
		if(children.constructor === Array)
			newOne.appendChildren(...children);
		else
			newOne.appendChild(children);
	}
	
	if(moreProps) {
		for(let k=0;k<moreProps.length;k+=2) {
			newOne[moreProps[k]] = moreProps[k+1];
		}
	}
	
	return newOne;
};

/* Usage
dobj("div","even","content")                         <div class="even">content</div>

dobj("span",["sp","headline"],"Title")               <span class="sp" id="headline">Title</span>

dobj("pre",[,"firstCode"],"console.log(1);")         <pre id="firstCode">console.log(1);</pre>

dobj("ul","list","Head for a list",[                 <ul class="list">Head for a list
	dobj("li","listitem","item 1"),                      <li class="listitem">item 1</li>
	dobj("li","listitem","item 2"),                      <li class="listitem">item 2</li>
	dobj("li","listitem","item 3")                       <li class="listitem">item 3</li>
])                                                   </ul>

let item1 = dobj("li","listitem","item 1");
let item2 = dobj("li","listitem","item 2");
let item3 = dobj("li","listitem","item 3");
dobj("ul","list","",[item1,item2,item3])             <ul class="list">
                                                       <li class="listitem">item 1</li>
                                                       <li class="listitem">item 2</li>
                                                       <li class="listitem">item 3</li>
                                                     </ul>

let testDiv = dobj("div",[,"testDiv"],"test text");  <div id="testDiv">
testDiv.appendChildren(                                test text
	dobj("span","testClass","text"),                     <span class="testClass">text</span>
	dobj("span","testClass","text"),                     <span class="testClass">text</span>
	dobj("span","testClass","text")                      <span class="testClass">text</span>
)                                                    </div>

let arbitraryInput = dobj("input","","",[],          <input disabled style="width: 90px" value="default text">
	"style","width: 90px;",
	"disabled","true",
	"value","default text"
);
*/