p5.js createElement() Function

The createElement() function is used to create a element in the DOM (Document Object Model). The .position() function is used to set the position of the element.

Note: This function requires the p5.dom library. So add the following line in the head section of the index.html file.

<script src=”https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.11/addons/p5.dom.min.js”></script>>

Syntax:

createElement( tag, [content] )

Parameters: This function accepts two parameters as mentioned above and described below:

• tag: This parameter holds the tag for the new element.
• content: This parameter holds the html content to be inserted into the element

Return Value: It returns a pointer element holding the created node object.

Example: This example uses createElement() function to create the element.

Javascript

function setup() {
  // create canvas
  createCanvas(400, 400);
}

function draw() {
  // set background color
  background(150, 255, 134);
  // create the element
  create_element = createElement('h1', ["GeeksForGeeks!"]);

  // position the element
  create_element.position(50, 100);

}

Output:

Reference: https://p5js.org/reference/#/p5/createElement