p5.js | value() Function
The value() function is an inbuilt function which is used to set or return the value of the element.
This function requires p5.dom library. So add the following line in the head section of the index.html file.
<script language="javascript" type="text/javascript" src="path/to/p5.dom.js"> </script> |
chevron_right
filter_none
Syntax:
value()
or
value( value )
Parameters: This function accepts single parameter value which holds the value in number or string format.
Return Value: This function returns the value of the element.
Below examples illustrate the value() function in p5.js:
Example 1: This example uses value() function to display the value as output.
// Gets the value var input_val; function setup() { // Canvas size 400*400 createCanvas(400, 200); // Set background color background('green'); // Create an input element with its value input_val = createInput('Welcome to GeeksforGeeks'); // Set the position of div element input_val.position(30, 80); // Set width of input field input_val.style('width', '250px'); // Set font-size of input text input_val.style('font-size', '20px'); // Set margin propery input_val.style('margin-left', '50px'); } function mousePressed() { // Display the input value print(input_val.value()); } |
chevron_right
filter_none
Output:
Example 2: This example uses value() function to set the value of an element.
// Set the input value var input_val; function setup() { // Canvas size 400*400 createCanvas(400, 200); // Set background color background('green'); // Create an input element with its value input_val = createInput('Welcome to GeeksforGeeks'); // Set the position of div element input_val.position(30, 80); // Set width of input field input_val.style('width', '250px'); // Set font-size of input text input_val.style('font-size', '20px'); // Set margin propery input_val.style('margin-left', '50px'); } function mousePressed() { // Change input value input_val.value('A computer science portal'); } |
chevron_right
filter_none
Output:
- Before Click on the Element:
- After Click on the Element:
Recommended Posts:
- How to call a function that return another function in JavaScript ?
- How to get the function name inside a function in PHP ?
- How to get the function name from within that function using JavaScript ?
- PHP | Ds\Set contains() Function
- PHP | end() Function
- PHP | pos() Function
- PHP | key() Function
- PHP | Ds\Map put() Function
- p5.js | max() function
- PHP | Ds\Map xor() Function
- D3.js | d3.rgb() Function
- p5.js | pow() function
- p5.js | day() function
- p5.js | abs() function
- p5.js | sq() function
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.
