2023-10-02 22:29:49 +08:00
|
|
|
export function createElement({ innerText, textContent, onclick, children = [], dataset, classList = [], ...attributes }, tagName = 'div') {
|
2023-10-02 22:28:55 +08:00
|
|
|
const element = document.createElement(tagName)
|
2023-10-02 22:24:38 +08:00
|
|
|
for (const key in attributes) {
|
|
|
|
element.setAttribute(key, attributes[key])
|
|
|
|
}
|
|
|
|
element.classList.add(...classList)
|
|
|
|
if (innerText) element.innerText = innerText
|
|
|
|
if (textContent) element.textContent = textContent
|
|
|
|
if (onclick) element.onclick = onclick
|
|
|
|
if (dataset) Object.keys(dataset).forEach(key => element.dataset[key] = dataset[key])
|
|
|
|
if (children) children.forEach(child => element.appendChild(child))
|
|
|
|
return element
|
2023-09-28 15:20:02 +08:00
|
|
|
}
|
|
|
|
|
2023-10-02 22:28:55 +08:00
|
|
|
export function List(options) {
|
|
|
|
return createElement(options, 'ul')
|
2023-09-28 15:20:02 +08:00
|
|
|
}
|
2023-10-02 08:11:28 +08:00
|
|
|
|
2023-10-02 22:28:55 +08:00
|
|
|
export function ListItem(options) {
|
|
|
|
return createElement(options, 'li')
|
2023-10-02 22:24:38 +08:00
|
|
|
}
|
|
|
|
|
2023-10-02 22:28:55 +08:00
|
|
|
export function Span(options) {
|
|
|
|
return createElement(options, 'span')
|
|
|
|
}
|
|
|
|
|
|
|
|
export function Button(options) {
|
|
|
|
return createElement(options, 'button')
|
2023-10-02 08:11:28 +08:00
|
|
|
}
|