Sometimes, we want to sanitize user input before adding it to the DOM in JavaScript.
In this article, we’ll look at how to sanitize user input before adding it to the DOM in JavaScript.
How to sanitize user input before adding it to the DOM in JavaScript?
To sanitize user input before adding it to the DOM in JavaScript, we use the string replace
method.
For instance, we write
const sanitize = (string) => {
const map = {
"&": "&",
"<": "<",
">": ">",
'"': """,
"'": "'",
"/": "/",
};
const reg = /[&<>"'/]/gi;
return string.replace(reg, (match) => map[match]);
};
to call string.replace
with reg
and a callback to replace the characters to be escaped with the corresponding HTML entities.
reg
matches all values since it has the g
flag.
And the i
flag makes replace
match in a case-insensitive manner.
Conclusion
To sanitize user input before adding it to the DOM in JavaScript, we use the string replace
method.