Javascript displaying code

Question

I have a setup to display something when it detects adblock, and it's displaying code instead of working. I am not that experienced in Javascript to know why. Okay, in my index file I have

<script type="text/javascript" src="inls/advertisement.js"></script>

Now in advertisement.js I have

document.write('<div id="tester">an advertisement</div>');

And now I have the following in my index after that:

<script type="text/javascript">
if (document.getElementById("tester") != undefined)
{ 
document.write('<center><script type="text/javascript"><!--google_ad_client = "ca-pub-3846434391631935";/* talknow */google_ad_slot = "6591659297";google_ad_width = 728; google_ad_height = 90; //--> <script src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script></center>');
 } else {
    document.write('<p class="no">We\'ve detected that you\'re using <strong>AdBlock Plus</strong> or some other adblocking software. Please be aware that this is only contributing to the demise of the site. We need money to operate the site, and almost all of that comes from our online advertising. Its not nice to steal.<!-- end .content --></p>');
}
</script>

but where that code is, it displays as this:

Can anyone help?

Answer 1

I took a look at your actual website's source code. It's different to what you posted:

<script type="text/rocketscript">
if (document.getElementById("tester") != undefined)
{ 
document.write('<center><script type="text/javascript"><!--google_ad_client = "ca-pub-3846434391631935";/* talknow */google_ad_slot = "6591659297";google_ad_width = 728; google_ad_height = 90; //--> <script src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script></center>'); } else {
    document.write('<p class="no">We\'ve detected that you\'re using <strong>AdBlock Plus</strong> or some other adblocking software. Please be aware that this is only contributing to the demise of the site. We need money to operate the site, and almost all of that comes from our online advertising. Its not nice to steal.<!-- end .content --></p>'); }
</script>

Based on Why is wordpress placing "text/rocketscript" instead of "text/javascript" when using wp_register_script()? it seems like you need to change your <script> tag to:

<script data-cfasync="false" type="text/javascript>

Also, document.write is considered "bad practice"; you should probably use DOM manipulation instead, i.e. something like:

var adblock = document.createElement('p');
adblock.className = 'no';
adblock.innerHTML = 'Some text here';

var content = document.getElementById('content');
content.insertBefore(adblock, content.firstChild);