Code which will decode base64 encoded text automatically on pageload

Question

I need some help with something I am working on, I have text in a html class element, the method I need requires javascript to decode a string of text which is base64 encoded.

To confirm I have already read the post here: Base64 encoding and decoding in client-side Javascript This didn't help me, as mentioned below I am only familiar with a very basic amount of javascript, as I code using PHP only.

Basically I need something where the below:

<span class="className">SGVsbG8gd29ybGQh</class>

would then change to this when the page loads, after decoding:

<span class="className">Hello world!</class>

So when viewing the source code, one would only see the base64 encoded text, but the page viewer would get the decoded text visible.

I'm sure this is probably something simple, but I am a tragic when it comes to Javascript, hence I didn't show any of my previous JS attempts at doing this, as I don't think it would be useful to anyone.

Possible duplicate of [Base64 encoding and decoding in client-side Javascript](https://stackoverflow.com/questions/2820249/base64-encoding-and-decoding-in-client-side-javascript) — jontro, Apr 08 '18 at 18:52

user3483203 · Accepted Answer · 2018-04-08T19:03:10.433

2

You could use a function that on load uses the atob() method:

(function() {
  var x = document.getElementsByClassName("className")
  Array.prototype.forEach.call(x, function(el) {
    el.innerHTML = atob(el.innerHTML);
  });
})();

<span class="className">SGVsbG8gd29ybGQh</span>
<span class="className">QW55IGNsYXNzIG5hbWVkICdjbGFzc25hbWUnIHdpbGwgYmUgZGVjb2RlZA==</span>

edited Apr 08 '18 at 19:03

answered Apr 08 '18 at 18:56

user3483203

50,081
9
65
94

Code which will decode base64 encoded text automatically on pageload

1 Answers1