p5.js createSpan() Function

Last Updated : 16 Aug, 2023

The createSpan() function is used to create a span element in the DOM with the given optional inner html. Syntax:

createSpan([html])

Parameters: This function accepts a single parameter as mentioned above and described below:

html: It is a string with the innerHTML of the span element. It is an optional parameter.

Return Value: It returns a pointer to the p5.Element with the created node. The example below illustrate the createSpan() function in p5.js: Example:

javascript

function setup() {
  createCanvas(600, 300);
 
  textSize(18);
  text("Click on the button to create" +
       "<span> elements at random positions.", 20, 20)
  genBtn = createButton("Create span element").position(30, 40);
  genBtn.mousePressed(spawnSpan);
}
 
function spawnSpan() {
  newSpan = createSpan("This is a <b>span</b> element"+
                       " with custom <i>innerHTML</i>.");
  newSpan.position(random(50, 500), random(50, 300));
}