How do I escape a single quote ( ' ) in JavaScript?

Question

UPDATE: I want to give an updated answer to this question. First, let me state if you're attempting to accomplish what I have below, I recommend that you manage events by adding event listeners instead. I highly recommend that you utilize jQuery for your project and use their syntax to manage event listeners over using DOM.

QUESTION

Okay, I am basically doing this:

document.getElementById("something").innerHTML = "<img src='something' onmouseover='change(\'ex1\')' />";

I don't want double quotes (") where I put the \'. I only want a single quote, so I am trying to not make it put a double when it is used. I am trying to reach this in the final outcome.

<img src="something" onmouseover="change('ex1')" />

Escaping isn't working for me.

My marked answer works fine, however, the cleaner (and more professional-looking way, IMO) is loganfsmyth's answer.

http://stackoverflow.com/questions/8744315/single-quote-escape-in-javascript-function-parameters — gongzhitaao, Apr 21 '13 at 18:53

score 201 · Accepted Answer · answered Apr 21 '13 at 18:53

201

You should always consider what the browser will see by the end. In this case, it will see this:

<img src='something' onmouseover='change(' ex1')' />

In other words, the "onmouseover" attribute is just change(, and there's another "attribute" called ex1')' with no value.

The truth is, HTML does not use \ for an escape character. But it does recognise " and ' as escaped quote and apostrophe, respectively.

Armed with this knowledge, use this:

document.getElementById("something").innerHTML = "<img src='something' onmouseover='change(&quot;ex1&quot;)' />";

... That being said, you could just use JavaScript quotes:

document.getElementById("something").innerHTML = "<img src='something' onmouseover='change(\"ex1\")' />";

answered Apr 21 '13 at 18:53

Niet the Dark Absol

320,036
81
464
592

27

…or, even better, don't use inline attribue handlers at all; especially on elements created via javascript. – Bergi Apr 21 '13 at 18:58
I am not able to understand the question what does ex1 mean ? – Suraj Jain Jan 22 '17 at 13:07
1

@SurajJain `'ex1'` is just an arbitrary string value that OP wanted to pass into a function. – JLRishe Mar 16 '17 at 19:48

h2ooooooo · Answer 2 · 2014-04-09T14:42:24.963

183

The answer here is very simple:

You're already containing it in double quotes, so there's no need to escape it with \.

If you want to escape single quotes in a single quote string:

var string = 'this isn\'t a double quoted string';
var string = "this isn\"t a single quoted string";
//           ^         ^ same types, hence we need to escape it with a backslash

or if you want to escape \', you can escape the bashslash to \\ and the quote to \' like so:

var string = 'this isn\\\'t a double quoted string';
//                    vvvv
//                     \ ' (the escaped characters)

However, if you contain the string with a different quote type, you don't need to escape:

var string = 'this isn"t a double quoted string';
var string = "this isn't a single quoted string";
//           ^        ^ different types, hence we don't need escaping

edited Apr 09 '14 at 14:42

answered Apr 21 '13 at 18:52

h2ooooooo

39,111
8
68
102

1

Sir `` `` This is not working can you point out an error ? – Suraj Jain Jan 22 '17 at 07:44
@SurajJain First of all you shouldn't use the quotes inside of alert - you're outputting a text value, and secondly you should either escape your quotes or change their type in your script. – h2ooooooo Jan 22 '17 at 19:45
Thanks , can you also tell me what line height is ? – Suraj Jain Jan 22 '17 at 19:57
@SurajJain The comments here aren't really good for any kind of irrelevant discussion, but a line height is the height of the lines. You can [check out the `line-height` entry on MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height) – h2ooooooo Jan 23 '17 at 08:12

score 40 · Answer 3 · answered Apr 21 '13 at 18:52

40

You can escape a ' in JavaScript like \'

answered Apr 21 '13 at 18:52

mburm

1,417
2
17
37

score 22 · Answer 4 · answered Apr 21 '13 at 18:53

22

Since the values are actually inside of an HTML attribute, you should use '

"<img src='something' onmouseover='change(&apos;ex1&apos;)' />";

answered Apr 21 '13 at 18:53

loganfsmyth

156,129
30
331
251

This worked for me when trying to use inside of a text/x-template. – seagulledge Mar 12 '21 at 23:10

score 5 · Answer 5 · edited May 04 '15 at 16:55

5

    document.getElementById("something").innerHTML = "<img src=\"something\" onmouseover=\"change('ex1')\" />";

OR

    document.getElementById("something").innerHTML = '<img src="something" onmouseover="change(\'ex1\')" />';

It should be working...

edited May 04 '15 at 16:55

Peter Mortensen

30,738
21
105
131

answered Apr 21 '13 at 20:21

David Tayfun

51
3

How do I escape a single quote ( ' ) in JavaScript?

5 Answers5

Linked

Related