html - Tumblr theme getting tags of a post in JavaScript -

i want use tags of post in javascript. tags using following:

<article class="post" data-tags="{tagsasclasses}"> 

this worked fine until needed use special characters | becomes _ property , gives me wrong tag.

so need (using {block:tags}):

<article class="post" data-tags="{block:hastags}{block:tags}{tag}{/block:tags}{/block:hastags}"> 

yet foresee problems if {tag} ever has double quote in it.

is there way can keep data-tags attribute , still use {block:tags} real tag?

i have come solution involves adding , reading bunch of markup don't much.

<div class="posthiddentags" style="display:none;">     {block:hastags}         {block:tags}<div data-tag={jstag} data-tagurl={jstagurl}></div>{/block:tags}     {/block:hastags} </div> 

if need tags in javascript, can define them in <script> tag start. in theme html:

<script>     var tags = {};      {block:posts}     {block:hastags}     tags[{jspostid}] = [         {block:tags}         {             "tag": {jstag},             "tagurl": {jstagurl},         },         {/block:tags}     ];     {/block:hastags}     {/block:posts} </script> 

you have global javascript dictionary, post's id list of tags (and tag urls). "js" prefix output string wrapped in quotes.

in each of post elements, add attribute post id:

{block:posts} <article data-id="{postid}" class="post"></article> {/block:posts} 

you can have {block:posts} multiple times in template, although the theme documentation not mention this.

whenever need post's tags, post id dom element, id in tag dictionary. way don't have worry escaping/un-escaping special characters.