Javascript Reference - HTML DOM Style quotes Property








The quotes property sets or gets the quotation marks for embedded quotations.

Browser Support

quotes Yes Yes Yes Yes Yes

Syntax

Return the quotes property:

var v = object.style.quotes;

Set the quotes property:

object.style.quotes='none|string string string string|initial|inherit'

Property Values

The property values are listed in the following table.

Value Description
none Not to add "open-quote" and "close-quote" to the "content" property
string string string string The first two values sets the first level of quotation embedding, the next two values sets the next level of quote embedding...
inherit Inherit the quotes property from the parent element

The following table shows the Quotation Mark Characters

Result Description Entity Number
" double quote "
' single quote '
single, left angle quote ‹
single, right angle quote ›
« double, left angle quote «
» double, right angle quote »
left quote (single high-6) ‘
right quote (single high-9) ’
left quote (double high-6) “
right quote (double high-9) ”
double quote (double low-9) „




Technical Details

Default Value: none 
Return Value: A string representing the type of quotation marks for embedded quotations
CSS Version CSS2

Example

The following code shows how to change quotation marks.


<!DOCTYPE html>
<html>
<body>
<q id="myQ">This is a quote.</q>
<button onclick="myFunction()">test</button>
<script>
function myFunction() {<!-- w w w . j a va2 s  .  c  o m-->
    document.getElementById("myQ").style.quotes = "'?' '?'";
}
</script>
</body>
</html>

The code above is rendered as follows:





Example 2

The following code shows how to get the quotes property


<!DOCTYPE html>
<html>
<body>
<p><q id="myQ" style="quotes:'?' '?';">This is a quote.</q></p>
<button type="button" onclick="myFunction()">test</button>
<script>
function myFunction() {<!--from www  .j  a v a  2 s. c  o m-->
    console.log(document.getElementById("myQ").style.quotes);
}
</script>
</body>
</html>

The code above is rendered as follows: