Open In App

p5.js DOM and Rendering Complete Reference

Improve
Improve
Like Article
Like
Save
Share
Report

DOM is a way to represent the webpage in a structured hierarchical way so that it will become easier for programmers and users to glide through the document. The functions used in p5.js are mentioned below.

DOM

Description

select() It searchs an element in the page with the given id, class or tag name and return it as a p5.element.
selectAll() It searchs for elements with the given id, class or tag name and return it as a p5.Element array.
removeElements() It removes all the elements currently present that are created by p5
changed() It is fired whenever the value of an element gets changed.
input() It is invoked whenever user input is detected on the element.
createSpan() It creates a span element in the DOM with the given optional inner html.
createSlider() It creates a slider (input) element in the DOM.
createButton() It creates a button element in the DOM.
createCheckbox() It creates a checkbox element in the DOM.
createSelect() It creates a dropdown menu element in the DOM for taking input.
createRadio() It creates a radio-button element in the DOM.
createColorPicker() It creates a color-picker element in the DOM for taking input color.
createInput() It creates an input element in the DOM for accepting text input.
createFileInput() It creates an input element with the type of ‘file’ that can be used by the user to select local files.
createVideo() It creates a video element in the DOM.
createAudio() It creates an audio element in the DOM.
createElement() It creates a element in the DOM.

Rendering

Description

resizeCanvas() It resizes the canvas to the height and width given as parameters.
noCanvas() It removes the default canvas that is created by p5.js.
blendMode() It is used to blend two pixels according to the given blending mode.

Last Updated : 16 Aug, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads