47203

Unicode in data-content for pseudo element content

I would like to put unicode in the data-content attribute using JQuery so as to use it for pseudo element content, but I can't find the right format. How do you display unicode? The fallowing just displays ▼.

a::after
{
    content: attr(data-content);
}


<a href="...">...</a>


$("a").attr ("data-content", "&#x25BC;");

    

Answer1:

Insert in this format, using the \u that, in Javascript, denotes an Unicode number inside a string literal

$("a").attr ("data-content", "\u25BC");

From <strong>MDN Unicode escape docs</strong>:

You can use the Unicode escape sequence in string literals, regular expressions, and identifiers. The escape sequence consists of six ASCII characters: \u and a four-digit hexadecimal number. For example, \u00A9 represents the copyright symbol. Every Unicode escape sequence in JavaScript is interpreted as one character.

<div class="snippet" data-lang="js" data-hide="true"> <div class="snippet-code snippet-currently-hidden">

$("a").attr ("data-content",  "\u25BC");
a::after
{
    content: attr(data-content);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>


<a href="...">...</a>


Recommend

  • Table cell background bleeds through a table with rounded corners
  • POST request does not work from Angular5 code but works from Postman [duplicate]
  • Javascript null object type
  • ES6 import equivalent of require() without exports
  • Remove Style on Element
  • typeof returns “object” for `this`, “number” elsewhere
  • Can a pure function return a Symbol?
  • Breaking out of JavaScript 'For' Loop using False?
  • What does the star mean in function definition like “function* ()”? [duplicate]
  • What is window.onpaint?
  • CSS method instead of display:run-in; to position a block inline?
  • keyDown event is not fired for Capslock in Mac
  • Overflow: hidden but i still want to have the empty scrollbar
  • where is chrome CSS Reference
  • SQL Server Nvarchar and Java prepared statement
  • JS object key sequence
  • Sort by a column in a union query in SqlAlchemy SQLite
  • SAVE attribute needed for Fortran variables when only the C_LOC address is returned to a C program?
  • SAXReader not re-ecape characters
  • Angularjs pass function from Controller to Directive (or call controller function from directive) -
  • Simulate click Geckofx vb,net
  • saving file generated by TCPDF
  • d3 v4 drag and drop with TypeScript
  • How do I pass the string value parameter of the selected list item from an auto-populated dropdown l
  • Jquery UI tool tip close icon
  • PHP - How to update data to MySQL when click a radio button
  • HTML download movie download link
  • Updating server-side rendering client-side
  • Join two tables and save into third-sql
  • How to handle AllServersUnavailable Exception
  • using conditional logic : check if record exists; if it does, update it, if not, create it
  • How to set the response of a form post action to a iframe source?
  • Setting background image for body element in xhtml (for different monitors and resolutions)
  • IndexOutOfRangeException on multidimensional array despite using GetLength check
  • costura.fody for a dll that references another dll
  • Observable and ngFor in Angular 2
  • How to Embed XSL into XML
  • UserPrincipal.Current returns apppool on IIS
  • Conditional In-Line CSS for IE and Others?
  • java string with new operator and a literal