The textContent property in HTML is used to set or return the text content of the specified node and all its descendants. This property is very similar to nodeValue property but this property returns the text of all child nodes.
Syntax:
- It is used to set the text of node.
node.textContent = text
- It is used to return the text of node.
node.textContent
Property Value: It contains single value text which contains node the node content.
Return Value: It returns a string value which represents the text content of a particular node node and all descendants.
Example 1:
html
<!DOCTYPE html> <html>
<head>
<title>
HTML DOM textContent Property
</title>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h2>HTML DOM textContent Property</h2>
<button id = "geeks" onclick = "MyGeeks()">
Submit
</button>
<p id = "sudo"></p>
<script>
function MyGeeks() {
var text =
document.getElementById("geeks").textContent;
document.getElementById("sudo").innerHTML = text;
}
</script>
</body>
</html>
|
Output:
Before Click on the button:
After Click on the button:
Example 2:
html
<!DOCTYPE html> <html>
<head>
<title>
HTML DOM textContent Property
</title>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h2>HTML DOM textContent Property</h2>
<p id = "geeks" onclick = "MyGeeks()">
Hello Geeks!
</p>
<script>
function MyGeeks() {
document.getElementById("geeks").textContent
= "Welcome to GeeksforGeeks!";
}
</script>
</body>
</html>
|
Output:
Before Click on the text:
After Click on the text:
Supported Browsers: The browser supported by DOM textContent property are listed below:
- Google Chrome 1
- Edge 12
- Internet Explorer 9
- Firefox 1
- Opera 9
- Safari 3