Escape quotes in Javascript

Escape quotes in Javascript

In this article, we will see how to escape quotes in Javascript.

Let’s see what happens if we have singe quote in String and we also use single quotes to declare the string in javascript.

Output:

unknown: Unexpected token (1:26)

Ways to escape quotes in Javascript

There are multiple ways to escape quotes in Javascript. Let’s go through each of them.

Using escape character

You can use escape character backslash(\) to escape quotes in Javascript. It will prevent javascript to interpret end of String.

You can use \' to escape single quotes and \" to escape double quotes.

Let’s see with the example:
Escape single quotes

Output:

Let’s learn javascript

Escape double quotes

Output:

Let”s learn javascript

Using alternate String syntax

You can use opposite string syntax of the one you are currently having.

For example:
If you have single quotes in String, then you can define String in double quotes. Similarly, in case you have double quotes in String, then you can define String in single quotes.
Let’s see with the example:
Escape single quotes

Output:

Let’s learn javascript

Escape double quotes

Output:

Let’s learn javascript

Using template literals

Template literals use back ticks(`) rather than quotes to define String. With template literals, you can use both single quotes and double quotes inside a String, so you don;t have to escape quotes in String.

var str=Let's learn javascript and write "Hello world";
console.log(str);

Output:

Let’s learn javascript and write “Hello world”

As you can see, we have used single quotes and double quotes in same String and it just worked fine.

Escape quotes in Javascript in HTML context

If you need to escape quotes in HTML context, then you need to replace quotes with proper XML entity representation & quot;.

Please note that there should not be any space between & quot; here. I had to put a space because while rendering this page, wordpress was changing it to double quotes.

For example:

Let’s say you want to escape quotes "Tax" here in onClick event string.

You need to replace double quotes with " here.

So your onclick string will be:

Please note that there should not be any space between & quot; here. I had to put a space because while rendering this page, wordpress was changing it to double quotes.

That’s all about how to escape quotes in Javascript.

Related Posts

  • Javascript capitalize first letter
    06 December

    How to Capitalize first letter in Javascript

    Table of ContentsCapitalize first letter of String in JavascriptUsing charAt(), toUpperCase() and slice()Capitalize each word of String in Javascript In this tutorial, we will see how to Capitalize first letter in Javascript. Capitalize first letter of String in Javascript There are multiple ways to Capitalize first letter of String in Javascript. Let’s go through each […]

  • Add character to String in Javascript
    05 December

    Add character to String in Javascript

    Table of ContentsAdd character to String at start of String in JavascriptUsing + operatorUsing concat() methodAdd character to String at end of String in JavascriptUsing + operatorUsing concat() methodAdd character to String at given postionUsing substring() methodUsing slice() methodAdd character from array to String in JavascriptUsing + operatorUsing concat() method In this post, we will […]

  • 08 September

    jQuery html() method example

    In this post,  we are going to see jQuery html method. html method is used to get html content of first matched elements,  other elements will be ignored and html(‘new html content’) is used to set html content for all matched elements. Syntax for html() : [crayon-61dbf0eb4e81f311858096/] Syntax for html(‘new html content’) : [crayon-61dbf0eb4e825515230157/] Let’s […]

  • 28 August

    jQuery text() method example

    In this post,  we are going to see jQuery text method example. text method is used to get text of all matched elements and text(‘new text’) is used to set text for all matched elements. Syntax for text() : [crayon-61dbf0eb4feac225114840/] Syntax for text(‘new text’) : [crayon-61dbf0eb4feb5024440303/] Let’s understand with the help of example: [crayon-61dbf0eb4feb8547845543/] Live […]

  • 27 August

    jQuery prepend and prependTo example

    In this post,  we are going to see jQuery prepend and prependTo methods. Both do the same task, insert text or html before content of every selected elements, so it will put text or html to first index of selected element. Both methods add text or html as a child to selected elements .Syntax is […]

  • 25 August

    jQuery before() and insertBefore() example

    In this post,  we are going to see jQuery before and insertBefore methods. Both do the same task, insert text or html before every selected elements but syntax is quite different. Syntax for after(): [crayon-61dbf0eb51429430071397/] inserting using after [crayon-61dbf0eb51432644894219/] Syntax for insertBefore() : [crayon-61dbf0eb51434933228684/] inserting using insertBefore [crayon-61dbf0eb51436250300128/] Let’s understand with the help of example: […]

Leave a Reply

Your email address will not be published. Required fields are marked *

Subscribe to our newletter

Get quality tutorials to your inbox. Subscribe now.