Which reply is safer?

Stay safe

Some sample replies put a visitor's words straight into the page as HTML. That can be a problem even when the lesson looks simple.

One sample reply uses textContent for plain text; the other puts a visitor's words into innerHTML. MDN advises the first when the content should stay as text.Drawing: our own, simplified and not to scale

innerHTML parses its input as HTML and writes the result into the page. MDN warns that APIs like this are injection sinks, and can be a vector for cross-site scripting (XSS) attacks if the input originally came from an attacker. MDN: Element.innerHTML MDN says the innerHTML property is probably the most common vector for XSS attacks, when potentially unsafe strings from a user are put into the page without first being sanitised. MDN: Element.innerHTML

When you know the visitor-provided content should be plain text, MDN says Node.textContent should be used. That prevents the string being parsed as HTML. MDN: Element.innerHTML MDN advises against using innerHTML to get or set text inside an element, because it deals with raw HTML rather than plain text and can be susceptible to XSS attacks, even if you are sure the text never contains HTML syntax. MDN: Node.textContent

Reply A

A sample assistant reply, written for this lesson

// Sample assistant reply: "Show the visitor's name on the page like this."
const name = visitorInput;
el.innerHTML = name;

This is not a live answer from an AI tool. We wrote it for this lesson so every visitor sees the same text, and nothing you type is sent anywhere.

Reply B

A sample assistant reply, written for this lesson

// A safer reply for plain text, along the lines MDN advises.
const name = visitorInput;
el.textContent = name;

This is not a live answer from an AI tool. We wrote it for this lesson so every visitor sees the same text, and nothing you type is sent anywhere.

Which reply is safer for plain text?

You want to show a visitor's name as ordinary text on the page. Which sample reply is safer, according to MDN?

Sample assistant replies

The "assistant" replies on this site were written by us for the lesson. They are not live results from an AI tool, and nothing you type is sent to one. That way every visitor sees the same lesson.