HTML Standard Tracker

Filter

File a bug

SVNBugCommentTime (UTC)
3791<script> example.2009-09-10 09:57
@@ -13148,20 +13148,61 @@ o............A....e
   </div>
 
   <p class="note">When inserted using the <code
   title="dom-document-write">document.write()</code> method,
   <code>script</code> elements execute (typically synchronously), but
   when inserted using <code
   title="dom-innerHTML">innerHTML</code> and <code
   title="dom-outerHTML">outerHTML</code> attributes, they do not
   execute at all.</p>
 
+  <div class="example">
+
+   <p>The following sample shows how a script element can be used to
+   define a function that is then used by other parts of the
+   document. It also shows how a <code>script</code> element can be
+   used to invoke script while the document is being parsed, in this
+   case to initialize the form's output.</p>
+
+   <pre>&lt;script>
+ function calculate(form) {
+   var price = 52000;
+   if (form.elements.brakes.checked)
+     price += 1000;
+   if (form.elements.radio.checked)
+     price += 2500;
+   if (form.elements.turbo.checked)
+     price += 5000;
+   if (form.elements.sticker.checked)
+     price += 250;
+   form.elements.result.value = price;
+ }
+&lt;/script>
+&lt;form name="pricecalc" onsubmit="return false">
+ &lt;fieldset>
+  &lt;legend>Work out the price of your car&lt;/legend>
+  &lt;p>Base cost: &pound;52000.&lt;/p>
+  &lt;p>Select additional options:&lt;/p>
+  &lt;ul>
+   &lt;li>&lt;label>&lt;input type=checkbox name=brakes> Ceramic brakes (&pound;1000)&lt;/label>&lt;/li>
+   &lt;li>&lt;label>&lt;input type=checkbox name=radio> Satellite radio (&pound;2500)&lt;/label>&lt;/li>
+   &lt;li>&lt;label>&lt;input type=checkbox name=turbo> Turbo charger (&pound;5000)&lt;/label>&lt;/li>
+   &lt;li>&lt;label>&lt;input type=checkbox name=sticker> "XZ" sticker (&pound;250)&lt;/label>&lt;/li>
+  &lt;/ul>
+  &lt;p>Total: &pound;&lt;output name=result onformchange="calculate(form)">&lt;/output>&lt;/p>
+ &lt;/fieldset>
+ &lt;script>
+  document.forms.pricecalc.dispatchFormChange();
+ &lt;/script>
+&lt;/form></pre>
+
+  </div>
 
 
 
   <h5 id="scriptingLanguages">Scripting languages</h5>
 
   <div class="impl">
 
   <p>A user agent is said to <dfn>support the scripting language</dfn>
   if <var>the script block's type</var> matches the <span>MIME type</span> of a
   scripting language that the user agent implements.</p>

|