JavaScript innerText is a property that allows you to access and modify the text content of an HTML element. It represents the visible text within the element, excluding any HTML tags or elements nested within it.
The innerText property can be used to access the current text content of an element or change it to a new value. It is commonly used to dynamically update the text on a webpage based on user interactions or data changes.
To access the innerText of an element, you can use either the dot notation or the DOM methods such as getElementById or querySelector. Here's an example of accessing the innerText using dot notation:
HTML:
<p id="myParagraph">This is some text.</p>
JavaScript:
const paragraph = document.getElementById("myParagraph");
console.log(paragraph.innerText);
// Output: This is some text.
To change the innerText of an element, simply assign the new text content to the innerText property. Here's an example:
HTML:
<p id="myParagraph">This is some text.</p>
JavaScript:
const paragraph = document.getElementById("myParagraph");
paragraph.innerText = "Updated text content.";
After executing the code above, the innerText of the paragraph element will be changed to "Updated text content." and reflect the update on the webpage.
It's important to note that innerText treats text as plain text and doesn't interpret it as HTML. Any HTML tags or entities present in the assigned value will be displayed as regular text. Additionally, innerText will also include any leading or trailing white spaces within the element.
To summarize, JavaScript innerText provides a convenient way to access and modify the visible text content of an HTML element. It's a useful property for dynamically manipulating text on a webpage.