2

I must remove content from a script with attribute id and type application/json in index.html. It is from another application (the app is based on another app) and I can't locate where the script exists. I tried: 

<script type="text/javascript">
    document.getElementById('wk-ra-state').textContent = ' ';
</script>

but without any effect probably because the script is always at the end of the index.html body. Any ideas?

nvioli
  • 4,137
  • 3
  • 22
  • 38
Natalia Gurgul
  • 79
  • 8
  • Possible duplicate of [How to empty the content of a div](https://stackoverflow.com/questions/5744233/how-to-empty-the-content-of-a-div) – Jonathan Gagne Oct 30 '18 at 14:50

1 Answers1

1

Actually, as your code that empty the script tag at the end of your HTML page is above it, it runs the code before the script is fully loaded. That is the reason why you get the error:

Uncaught TypeError: Cannot set property 'innerHTML' of null

In order to run the code after everything is loaded on the webpage, use:

document.addEventListener("DOMContentLoaded", function(event) {});

It will run the code after all DOM is loaded.

See the example below, the first example doesn't use the document.addEventListener("DOMContentLoaded", function(event) {}); and the second one using it.

Wrong example:

<script>
  document.getElementById('wk-ra-state').innerHTML = '';
</script>
<!-- end of the html page -->
<script id="wk-ra-state" type="application/json">{&q;APP_SERIALIZATION_KEY&q;:{&q;recentFavorites&q;:{&q;pending&q;:false,&q;recentItems&q;:[{&q;id&q;:&q;&q;,&q;viewed&q;:false,&q;type&q;:&q;document&q;,&q;title&q;:&q;&q;,&q;link&q;:&q;javascript:void(0)&q;}]},&q;suggestions&q;:{&q;pending&q;:false,&q;requests&q;:{},&q;cach ............ </script>

Good example:

<script>
  document.addEventListener("DOMContentLoaded", function(event) {
    document.getElementById('wk-ra-state').innerHTML = '';
  });
</script>
<!-- end of the html page -->
<script id="wk-ra-state" type="application/json">{&q;APP_SERIALIZATION_KEY&q;:{&q;recentFavorites&q;:{&q;pending&q;:false,&q;recentItems&q;:[{&q;id&q;:&q;&q;,&q;viewed&q;:false,&q;type&q;:&q;document&q;,&q;title&q;:&q;&q;,&q;link&q;:&q;javascript:void(0)&q;}]},&q;suggestions&q;:{&q;pending&q;:false,&q;requests&q;:{},&q;cach ............ </script>
halfer
  • 19,824
  • 17
  • 99
  • 186
Jonathan Gagne
  • 4,241
  • 5
  • 18
  • 30
  • Maybe for an element like div with text but not for this script. The script has duplicated the document content - it has object inside. Error after "Cannot set property 'innerHTML' of null" – Natalia Gurgul Oct 30 '18 at 14:59
  • Ok but your solution doesn't work for that script. The script: is still on this same place. – Natalia Gurgul Oct 30 '18 at 15:20
  • Thank you. I totally understand this mechanism but unfortunately your solution doesn't work in this case. The script with id is from another application (the app is based on another app) so it always be at the end of index.html, it is done at the end. The script with innerHTML or whatever which I will write in index.html always is placed before wk-ra-state script :) I can't change the file from comes the wk-ra-script. – Natalia Gurgul Oct 30 '18 at 16:19
  • Ok I got the right picture, you will have to use `document.addEventListener("DOMContentLoaded", function(event) {` as in my example and it will work. ;) – Jonathan Gagne Oct 30 '18 at 16:38