The selection.property() function is used to set or change the property and value of a particular element. The value of a particular property can be deleted by setting its value to null.
Syntax:
selection.property(name[, value]);
Parameters: This function accept two parameters as mentioned above and described below:
- name: The name of the property to set.
- value: The property value to be set.
Return Value: This function does not return any value.
Example 1:
HTML
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" path1tent= "width=device-width, initial-scale=1.0"> </script></head><body> <div> <input type="text"> </div> <script> // Sets value property of the input tag var input = d3.select("input") .property("value", "some value from input"); var text = document.querySelector("input"); // Value from input console.log(text.value); </script></body></html> |
Output:
Example 2:
HTML
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" path1tent= "width=device-width, initial-scale=1.0"> </script></head><body> <div> <input type="checkbox" class="checkbox" name="" id="">checkbox<br> <button>Click me</button> </div> <script> function func() { // Sets checked and value property // of the checkbox var chk = d3.select(".checkbox").property( "value", "some value from checkbox"); var chk = d3.select(".checkbox") .property("checked", true); var text = document.querySelector(".checkbox"); // Value from checkbox console.log(text.value); console.log(text.checked); } let btn = document.querySelector("button"); btn.addEventListener("click", func); </script></body></html> |
Output:
Before clicking the click me button:
After clicking the click me button:
