Access Contents of <noscript> with Javascript

Question

<noscript><div id="example">I want to get this innerHTML</div></noscript>

<script type="text/javascript"> alert($('example').innerHTML);</script>

This javascript snippet just returns an empty string. Is there a way of getting the contents of a noscript node?

p.s. I'm using prototype on this particular project.

Answer 1

If scripting is enabled, the noscript element is defined as containing only text - though it must be parsable text, with some restrictions on content. With that in mind, you should be able to extract the text, parse it, and then find your desired element. A rudimentary example of this follows:

var nos = document.getElementsByTagName("noscript")[0]; 
// in some browsers, contents of noscript hang around in one form or another
var nosHtml = nos.textContent||nos.innerHTML; 

if ( nosHtml )
{
  var temp = document.createElement("div");
  temp.innerHTML = nosHtml;

  // lazy man's query library: add it, find it, remove it
  document.body.appendChild(temp);
  var ex = document.getElementById("example");
  document.body.removeChild(temp);

  alert(ex.innerHTML);
}

Note that when I originally wrote this answer, the above failed in Google Chrome; access to noscript content appears to be somewhat better-supported these days, but it still strikes me as an edge-case that is perhaps somewhat more likely than other elements to exhibit bugs - I would avoid it if you've other options.

Answer 2

I'm not sure about prototype, but this works in Chrome with jQuery:

$('noscript').before($('noscript').text());

Answer 3

From the HTML 4.0 spec:

The NOSCRIPT element allows authors to provide alternate content when a script is not executed. The content of a NOSCRIPT element should only be rendered by a script-aware user agent in the following cases:

• The user agent is configured not to evaluate scripts.
• The user agent doesn't support a scripting language invoked by a SCRIPT element earlier in the document.

It seems to me that this implies that the entire contents of the NOSCRIPT tag (in this case, your div) are ignored altogether if scripting is enabled in the browser. Have you verified that the "example" div is accessible through the DOM at all in your case?