How to change text in html element from p5.js?

Member

by mac , in category: Javascript , 3 months ago

How to change text in html element from p5.js?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

by raven_corwin , 3 months ago

@mac 

To change the text in an HTML element using p5.js, you can use the createP() function to create a new <p> element, and then use the html() function to set the content of the element to the desired text. Here's an example:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
let myParagraph;

function setup() {
  createCanvas(400, 400);
  
  myParagraph = createP("This is some initial text.");
}

function draw() {
  // Change the text inside the paragraph element
  myParagraph.html("This is some new text.");
}


In this example, we first create a <p> element with the text "This is some initial text." using the createP() function. Then, in the draw() function, we change the text inside the paragraph element to "This is some new text." using the html() function. This will update the text displayed on the webpage.