How can I escape a single quote?

Question

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?

Hey Ravi, this is more of an html question. I retagged the question as HTML, but you might want to change that in your question. — Benjamin Manns, Mar 11 '10 at 20:57

score 415 · Accepted Answer · edited Nov 10 '17 at 20:13

415

You could use HTML entities:

' for '
" for "
...

For more, you can take a look at Character entity references in HTML.

edited Nov 10 '17 at 20:13

neaumusic

10,027
9
55
83

answered Mar 11 '10 at 20:55

Pascal MARTIN

395,085
80
655
663

41

Why *should* one use double quotes for attribute values? – Gumbo Mar 11 '10 at 20:59
aahhhh!!.. Can't I even think of this. Thanks a lot. :) – Ravi Mar 11 '10 at 21:01
HUmph ; I'm guessing I *should* have said *could*, as it helps, in this specific case, but is not necessarily necessary ;; still, a *(in my opinion)* good reason would be that it's closer to XHTML. – Pascal MARTIN Mar 11 '10 at 21:02
It's the convention... see: http://www.w3.org/TR/1999/REC-html401-19991224/intro/sgmltut.html#h-3.2.2 – road242 Mar 11 '10 at 21:04
5

@Pascal MARTIN: XML does also allow single quotes for attribute values. (See http://www.w3.org/TR/xml/#NT-AttValue) – Gumbo Mar 11 '10 at 21:06
4

@Gumbo : wooo ! I don't think I've ever seen any XML document that was using single-quotes arround attributes values ; so I didn't think this was actually valid ;; I just *(once again)* learnt something while answering a question ; so, thanks for those comments ! – Pascal MARTIN Mar 11 '10 at 21:08
5

I know this is old, but I think it's worth noting that there is an HTML entity for `"`: `"` – daiscog Mar 21 '13 at 11:11
1

@Pascal, w3c validator shows single quotes are valid for attributes. And see http://stackoverflow.com/questions/2210430/are-single-quotes-valid-in-html-xhtml – ChrisJJ Feb 16 '15 at 15:02
Thank you for hint , it was crashing on french accent so into javascript i repalce with utf8 character and add meta into html page to support utf 8 characters... stringToRepalce.replace(/'/g, "'"); – Swap-IOS-Android Sep 22 '17 at 09:08
@Gumbo I encountered a situation in ASP.Net with a user control... `' runat="server" />` failed to build. Converting the single quote to an HTML entity worked. – crenshaw-dev Apr 26 '18 at 17:50
@Gumbo For example when you embed JSON in an attribute. ``. Or Javascript: ``. Many legit use-cases... – Daniel W. Dec 28 '18 at 16:58

Benjamin Manns · Answer 2 · 2013-03-28T03:05:46.623

74

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.

edited Mar 28 '13 at 03:05

answered Mar 11 '10 at 20:55

Benjamin Manns

9,028
4
37
48

Wow, it's been awhile since I wrote this. Thanks for catching it - I've updated the links to two tables on W3C and WebPlatform.org. – Benjamin Manns Mar 28 '13 at 03:06
These work "everywhere" except in VXML Expression attributes where further escaping is necessary since in VXML a String variable value is indicated as single quotes within the normal double quotes of the attribute definitions: – Steve Cohen Oct 24 '14 at 21:30

score 10 · Answer 3 · answered Mar 11 '10 at 20:56

10

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&#39;lo'>

answered Mar 11 '10 at 20:56

Gumbo

643,351
109
780
844

but I didn't understand what do you mean by `context of html` ? – coding_idiot Nov 06 '14 at 09:58
@coding_idiot Have a look at the different [tokens a HTML parser may encounter during the parsing process](http://www.w3.org/TR/html5/syntax.html#tokenization). Each state has a different set of parsing rules that are triggered based on the input. Not every state allows character references. Now if you look at the [attribute value (single quoted)](http://www.w3.org/TR/html5/syntax.html#attribute-value-\(single-quoted\)-state), you can see that a `&` denotes the begin of a character reference. – Gumbo Nov 06 '14 at 11:25

score 8 · Answer 4 · edited Aug 12 '19 at 00:26

8

Represent it as a text entity (ASCII 39):

<input type='text' id='abc' value='hel&#39;lo'>

edited Aug 12 '19 at 00:26

Peter Mortensen

30,738
21
105
131

answered Mar 11 '10 at 20:56

AndiDog

68,631
21
159
205

score 6 · Answer 5 · answered Mar 11 '10 at 20:54

6

Probably the easiest way:

<input type='text' id='abc' value="hel'lo">

answered Mar 11 '10 at 20:54

road242

2,492
22
30

score 0 · Answer 6 · edited Jun 15 '21 at 22:36

0

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

edited Jun 15 '21 at 22:36

Peter Mortensen

30,738
21
105
131

answered Feb 25 '21 at 14:56

Picard

3,745
3
41
50

This is a valid way of tackling the problem and I do it regularly. I just paste in the character directly. – Savage Jun 11 '21 at 11:26
I would avoid this if at all possible, and try to fix the underlying issue. It can cause unexpected problems. For example, if the user meant to include a code sample, then having characters changed like this will cause confusion for the users that copy and paste the code sample. – Flimm Mar 04 '22 at 10:18

score 0 · Answer 7 · answered Mar 02 '22 at 16:04

0

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:

&apos;
<br>
&quot;

answered Mar 02 '22 at 16:04

Flimm

136,138
45
251
267

score -1 · Answer 8 · edited Nov 17 '12 at 23:38

-1

You could try using: 

edited Nov 17 '12 at 23:38

Luca

9,259
5
46
59

answered Mar 11 '10 at 20:54

thelost

6,638
4
28
44

score -2 · Answer 9 · answered Apr 10 '20 at 12:40

-2

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

answered Apr 10 '20 at 12:40

Ram Bharlia

62
3

`escape` is not unicode safe. The specification advises against its use. – Quentin May 28 '20 at 17:11
[`escape`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/escape) is deprecated. Also, it's not the type of escaping that is needed here, we are trying to escape `'` to an HTML entity like `'` or `'`, we are not trying to do percent-encoding, which has a different use-case. – Flimm Mar 04 '22 at 10:16

How can I escape a single quote?

9 Answers9

Linked

Related