What is the difference between `innerHTML`, `textContent`, and `innerText`?

Beginner

Answer

  • innerHTML: Gets/sets HTML content including tags
  • textContent: Gets/sets text content, ignores styling
  • innerText: Gets/sets visible text content, respects styling
element.innerHTML = '<b>Bold</b>';    // Renders as bold
element.textContent = '<b>Bold</b>';  // Shows literal text
element.innerText = 'Visible text';   // Respects CSS display