innerHTML gets and sets HTML markup, textContent gets and sets raw text, and innerText gets and sets only the text a user can see.
innerHTML parses what you assign as HTML, so '<b>Bold</b>' renders as bold text. Never assign untrusted input to it, because that opens the page to cross-site scripting.
textContent treats everything as plain text, so the same string shows the tags literally. It ignores styling and returns the text of every node, including hidden elements and <script> content.
innerText respects CSS, so it skips hidden elements. Reading it forces the browser to calculate layout, which makes it slower.
Saved in this browser - sign in to keep your review list.
How should your speech become text?
Listening… your words appear above as you speak - tap Stop when you're done.
Recording · cr - tap Stop & transcribe when you're done.
Transcribing with AI…
Voice:
Keep going - a few more words and AI can grade it.
Interview lens
How interviewers actually use this question
Likely follow-ups
Why is innerHTML an XSS risk, and how would you show user-supplied HTML safely?Parsed markup can carry handlers like an img onerror that run code. Use textContent for text, or sanitize with a library such as DOMPurify first.
Why is reading innerText slower than reading textContent?innerText depends on computed styles, so reading it forces a style and layout pass. Inside a loop that also writes to the DOM, that means layout thrashing.
What's wrong with using innerHTML += to add items to a list in a loop?Each call serializes and reparses all the content and recreates every child, which drops listeners and typed input. Use appendChild or insertAdjacentHTML.
How do textContent and innerText differ in the whitespace and line breaks they return?textContent returns text nodes as written. innerText returns text as rendered, collapsing whitespace and turning <br> and block edges into newlines.
What you can say
All three read and write an element's content, but innerHTML works with HTML markup, textContent with raw text, and innerText with only the text a user can see.
innerHTML parses what you assign as HTML, so a string with bold tags actually renders in bold.
That parsing is the danger, because assigning untrusted input to innerHTML exposes the page to cross-site scripting.
textContent treats everything as plain text, so the same string shows the tags literally, and reading it returns the text of every node, hidden elements and script content included.
innerText respects CSS and skips hidden elements, but reading it forces the browser to calculate layout, so it's slower.
For plain text I default to textContent because it's safe and fast, and I only use innerHTML when I control the markup.
Weak answers to avoid
Treats textContent and innerText as the sameThey differ on CSS. innerText skips hidden elements and forces a layout calculation on read. Name that difference and say which one you default to.
Skips the XSS risk of innerHTMLSecurity is the part the interviewer is listening for. Say that untrusted input in innerHTML allows cross-site scripting and that textContent avoids it.
Thinks only <script> tags make innerHTML unsafeBrowsers don't run script tags inserted through innerHTML, but attributes like an img's onerror do run. Any untrusted markup is the risk, not just script tags.
Reaches for innerText by defaultReading innerText forces layout, so it is slower. Use textContent for plain text and keep innerText for when you need only the visible text.
Interview lens
Likely follow-ups, what you can say, and the weak answers to avoid.
