How can I escape a single quote?
HtmlEscapingHtml Problem Overview
How can I escape a '
(single quote) in HTML?
This is where I'm trying to use it:
<input type='text' id='abc' value='hel'lo'>
The result for the above code is "hel" populated in the text box. I tried to replace '
with \'
, but this what I'm getting.
<input type='text' id='abc' value='hel\'lo'>
The result for the above code is "hel" populated in the text box.
How can I successfully escape the single quotes?
Html Solutions
Solution 1 - Html
You could use HTML entities:
'
for'
"
for"
- ...
For more, you can take a look at Character entity references in HTML.
Solution 2 - Html
You can use '
(which is iffy in IE) or '
(which should work everywhere). For a comprehensive list, see the W3C HTML5 Named Character References or the HTML entities table on WebPlatform.org.
Solution 3 - Html
As you’re in the context of HTML, you need to use HTML to represent that character. And for HTML you need to use a numeric character reference '
('
hexadecimal):
<input type='text' id='abc' value='hel'lo'>
Solution 4 - Html
Represent it as a text entity (ASCII 39):
<input type='text' id='abc' value='hel'lo'>
Solution 5 - Html
Probably the easiest way:
<input type='text' id='abc' value="hel'lo">
Solution 6 - Html
If for some reason you cannot escape the apostrophe character and you can't change it into a HTML entity (as it was in my case for a specific Vue.js property) you can use replace to change it into different apostrophe character from the UTF-8 characters set, for instance:
ʼ - U+02BC
’ - U+2019
Solution 7 - Html
I personally find the named HTML entities easier to remember:
'
for'
(known as single quote or apostrophe, Unicode character U+0027)"
for"
(known as double quote or quotation mark, Unicode character U+0022)
Demo:
'
<br>
"
Solution 8 - Html
You could try using: ‘
Solution 9 - Html
use javascript inbuild functions escape and unescape
for example
var escapedData = escape("hel'lo");
output = "%27hel%27lo%27" which can be used in the attribute.
again to read the value from the attr
var unescapedData = unescape("%27hel%27lo%27")
output = "'hel'lo'"
This will be helpful if you have huge json stringify data to be used in the attribute