ansaurus

Question

noscript tag, I need to present alternative html if not enabled.

Answer 1

+1 A:

It will run scripts if scripts are enabled. If you want to stage the <noscript> behavior, disable JavaScript in your browser and try it out.

baretta 2009-01-28 17:23:22

Answer 2

+2 A:

An alternative to using <noscript> is to hide a certain element with JavaScript as soon as the page loads. If JavaScript is disabled, the element will remain as being displayed. If JavaScript is enabled, your script will be executed and the element will be hidden.

window.onload = function () {
    document.getElementById("no_script").style.display = "none";
}

<div id="no_script">
You don't have JavaScript enabled.
</div>

Update

If you want to do the opposite (show a bit of HTML when JavaScript is enabled), you can always inject new elements into the DOM tree using various methods. Here's one:

$(document).ready(function() {
    $('#container').html($('#content').html());
});

<div id="container"></div>
<script type="text/html" id="content">
    <div>Your <em>HTML</em> goes here</div>
</script>

Kudos to John Resig for the <script type="text/html"> trick for unobtrusively hiding HTML templates inside HTML. Browsers apparently don't execute or render <script> content of an unconventional type.

Ates Goral 2009-01-28 17:24:37

While this is definitely a suitable fallback plan (though you really shouldn't require one; noscript is practically universal), you'll want to be careful as this may make your page jump around a bit when it goes to hide the element in question.

Hexagon Theory 2009-01-28 18:39:26

I want to do the opposite of what you created.So I want to display the code if javascript is enabled.

Brad 2009-01-28 19:37:00

The question title suggests the opposite of what you just said. You might want to rephrase the question.

Ates Goral 2009-01-28 22:48:01

Answer 3

+3 A:

Somewhat like Ates's solution, you can use Javascript to change the content for the users who have it enabled. For example, let's say you have a fancy menu that gives Javascript users super-easy navigation, but is worthless to non-JS users. In the HTML set the display property to 'none' and then use JS to enable it. In your case, where you have content you don't want to show for the non-JS users, you can just hide it by default. The downside is if the browser has JS AND CSS turned off, this won't work. If you're worried about that, you could use JS to insert the content.

<html>
<head>
  <script>
    $(document).ready(function() {
      $('.jsok').show();
    });
  </script>
  <style>
    .jsok { display: none; }
  </style>
 </head>
 <body>
   <div class="jsok"><!-- content for JS users here--></div>
   <div><!-- content for everyone here --></div>
   <noscript><!-- content for non-js users here --></noscript>
 </body>
 </html>

Mr. Shiny and New 2009-01-28 22:45:02

ansaurus

tags:

views:

answers:

noscript tag, I need to present alternative html if not enabled.

Update

related questions