2024年09月10日(火)

任意のHTML要素を動的に生成する

• 0
• 0
• 4
• 3

Result

See the Pen
Untitled by kachibito (@kachibito)
on CodePen.

上記のように任意のHTML要素を動的生成するスクリプトです。

軽量且つ非依存で、HTMLタグの生成、プロパティの適用、コンテンツ追加、DOM要素の選択が容易に行えます。

javascript

(() => { const assignDeep = (elm, props) => Object.entries(props).forEach(([key, value]) => typeof value === 'object' ? assignDeep(elm[key], value) : Object.assign(elm, {[key]: value})) const tagNames = [ 'a', 'abbr', 'address', 'area', 'article', 'aside', 'audio', 'b', 'base', 'bdi', 'bdo', 'blockquote', 'body', 'br', 'button', 'canvas', 'c...