hixie: Elaborate on <noscript> example. (whatwg r3856)

hixie: Elaborate on <noscript> example. (whatwg r3856)

http://dev.w3.org/cvsweb/html5/spec/Overview.html?r1=1.3022&r2=1.3023&f=h
http://html5.org/tools/web-apps-tracker?from=3855&to=3856

===================================================================
RCS file: /sources/public/html5/spec/Overview.html,v
retrieving revision 1.3022
retrieving revision 1.3023
diff -u -d -r1.3022 -r1.3023
--- Overview.html 15 Sep 2009 06:36:29 -0000 1.3022
+++ Overview.html 15 Sep 2009 08:16:35 -0000 1.3023
@@ -11196,9 +11196,7 @@
   </dl><p class="note">All these contortions are required because, for
   historical reasons, the <code><a href="#the-noscript-element">noscript</a></code> element is handled
   differently by the <a href="#html-parser">HTML parser</a> based on whether <a href="#scripting-flag" title="scripting flag">scripting was enabled or not</a> when the
-  parser was invoked. The element is not allowed in XML, because in
-  XML the parser is not affected by such state, and thus the element
-  would not have the desired effect.<p>The <code><a href="#the-noscript-element">noscript</a></code> element must not be used in <a href="#xml-documents">XML
+  parser was invoked.<p>The <code><a href="#the-noscript-element">noscript</a></code> element must not be used in <a href="#xml-documents">XML
   documents</a>.<p class="note"><strong>The <code><a href="#the-noscript-element">noscript</a></code> element is only
   effective in the <a href="#syntax">the HTML syntax</a>, it has no effect in
   the <a href="#the-xhtml-syntax">the XHTML syntax</a>.</strong><div class="impl">
@@ -11235,10 +11233,43 @@
  &lt;/noscript&gt;
 &lt;/form&gt;</pre>
 
-   <p>When script is enabled, a button appears to do the calculation
+   <p>When script is disabled, a button appears to do the calculation
    on the server side. When script is enabled, the value is computed
    on-the-fly instead.</p>
 
+   <p>The <code><a href="#the-noscript-element">noscript</a></code> element is a blunt
+   instrument. Sometimes, scripts might be enabled, but for some
+   reason the page's script might fail. For this reason, it's
+   generally better to avoid using <code><a href="#the-noscript-element">noscript</a></code>, and to
+   instead design the script to change the page from being a
+   scriptless page to a scripted page on the fly, as in the next
+   example:</p>
+
+   <pre>&lt;form action="calcSquare.php"&gt;
+ &lt;p&gt;
+  &lt;label for=x&gt;Number&lt;/label&gt;:
+  &lt;input id="x" name="x" type="number"&gt;
+ &lt;/p&gt;
+ <strong>&lt;input id="submit" type=submit value="Calculate Square"&gt;</strong>
+ &lt;script&gt;
+  var x = document.getElementById('x');
+  var output = document.createElement('p');
+  output.textContent = 'Type a number; it will be squared right then!';
+  x.form.appendChild(output);
+  x.form.onsubmit = function () { return false; }
+  x.oninput = function () {
+    var v = x.valueAsNumber;
+    output.textContent = v + ' squared is ' + v * v;
+  };
+<strong>  var submit = document.getElementById('submit');
+  submit.parentNode.removeChild(submit);</strong>
+ &lt;/script&gt;
+&lt;/form&gt;</pre>
+
+   <p>The above technique is also useful in XHTML, since
+   <code><a href="#the-noscript-element">noscript</a></code> is not supported in <a href="#the-xhtml-syntax">the XHTML
+   syntax</a>.</p>
+
   </div><h3 id="sections"><span class="secno">4.4 </span>Sections</h3><h4 id="the-body-element-0"><span class="secno">4.4.1 </span>The <dfn><code>body</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
    <dd><a href="#sectioning-root">Sectioning root</a>.</dd>
    <dt>Contexts in which this element may be used:</dt>

Received on Tuesday, 15 September 2009 08:17:43 UTC