create

Función de ayuda para crear elementos del DOM, tanto HTML como SVG.

API

create

Devuelve

Argumento	Descripción	Tipo
HTMLElement	El elemento del DOM creado	HTMLElement

Parámetros

Parámetro	Descripción	Tipo	Por defecto
tagName	Nombre de la etiqueta	string	Obligatorio
options	Opciones de creación (opcional)	ElementCreationOptions	Opcional

Ejemplo

Uso básico

import { create } from 'ranuts';

const div = create('div');
div.textContent = 'Hello World';
document.body.appendChild(div);

Crear un elemento SVG

import { create } from 'ranuts';

const svg = create('svg');
svg.setAttribute('width', '100');
svg.setAttribute('height', '100');

const circle = create('circle');
circle.setAttribute('cx', '50');
circle.setAttribute('cy', '50');
circle.setAttribute('r', '40');
svg.appendChild(circle);

Usar las opciones de creación

import { create } from 'ranuts';

// Crear un elemento personalizado
const customElement = create('my-custom-element', { is: 'my-element' });

Notas

1. Reconocimiento automático: reconoce solo las etiquetas SVG y las crea con el espacio de nombres correcto.
2. Elementos HTML: los elementos HTML normales se crean con document.createElement.
3. Elementos SVG: los elementos SVG se crean con document.createElementNS.
4. Cuándo usarlo: es habitual cuando hace falta crear elementos SVG, porque acorta el trámite.