Tiyasa Mallick
Tiyasa Mallick

Reputation: 21

Data attribute in HTML

What does this means? And how to decode the data? data="B64ENCeyJCdXkiOjI3LCJPdmVyIjoyLCJIb2xkIjozLCJVbmRlcnBlcmZvcm0iOjAsIlNlbGwiOjB9"

Code from where I extracted this is:

<div 
  class="wsod_silo"
  data="B64ENCeyJCdXkiOjI3LCJPdmVyIjoyLCJIb2xkIjozLCJVbmRlcnBlcmZvcm0iOjAsIlNlbGwiOjB9"
  date="August 2020"
  id="wsod_ar7"
  style="width:32.75px;left:229.25px;">
</div>

Upvotes: 1

Views: 47

Answers (2)

nelek
nelek

Reputation: 4322

That means something is stored into some DOM element data encoded using Base64. You have to skip first part of string B64ENC and use rest of string and decode it.

For example, let put some button to decode it using js, and I put id for that div so we can use it in js easiest:

function dc() {
  //take complete string from data of DIV
  var div = document.getElementById('dd').getAttribute('data');
  //remove B64ENC part from string
  //string B64ENC length is 6 chars, so we take rest of string from position 6 (because substr 1st string is zero position)
  var ss = div.substr(6, div.length-6);
  //decode Base64 string
  var dc = atob(ss);
  //show result of decoded string
  document.getElementById('spResult').innerHTML = dc;
  //You can realize that decoded string is some JSON value string
}
<div id="dd" 
class="wsod_silo" data="B64ENCeyJCdXkiOjI3LCJPdmVyIjoyLCJIb2xkIjozLCJVbmRlcnBlcmZvcm0iOjAsIlNlbGwiOjB9" date="August 2020" id="wsod_ar7" style="width:32.75px;left:229.25px;"> </div>
<input type="button" value="Decode DIV data value" onclick="dc();" />
<span id="spResult"></span>

Upvotes: 1

epascarello
epascarello

Reputation: 207557

It is a base 64 encoded string. When you remove the B64ENC from the start you get

{"Buy":27,"Over":2,"Hold":3,"Underperform":0,"Sell":0}

var encodedString = 'eyJCdXkiOjI3LCJPdmVyIjoyLCJIb2xkIjozLCJVbmRlcnBlcmZvcm0iOjAsIlNlbGwiOjB9';
var decodedString = atob(encodedString);
console.log(decodedString);

Upvotes: 2

Related Questions