JavaScript

the script. directive

The script. directive corresponds directly to the HTML <script> element:

script. var d = new Date();
document.write("<p>The <em>Universal Coordinated Time</em> is ");
document.write(d.getUTCHours());
document.write(":");
document.write(d.getUTCMinutes());
document.write(".</p>");

<script type="text/javascript">
<!--
var d = new Date();
document.write("<p>The <em>Universal Coordinated Time</em> is ");
document.write(d.getUTCHours());
document.write(":");
document.write(d.getUTCMinutes());
document.write(".</p>");
// -->
</script>

the script key

The script key may be used to inject JavaScript into the <head> element. Multiple uses of define. script are additive with in a file so you can define your javascript near where it is used.

This may be near the top of the document:

define. script
function showDate() {
  var d = new Date();
  document.write("<p>The <em>Universal Coordinated Time</em> is ");
  document.write(d.getUTCHours());
  document.write(":");
  document.write(d.getUTCMinutes());
  document.write(".</p>");
}

And this may be near the bottom:

define. script
function showNavInSidebar(url) {
  var theLinks = document.getElementById("sidebar").getElementsByTagName('a');
  for( i=0; i < theLinks.length; i++ ) {
    var link = theLinks[i];
    if( link == url  ) {
      var last = document.getElementById("selected");
      if( last != null ) {
        last.className="";
        last.id="";
      }
    }
    var li = link.parentNode;
    li.className = "currentLink";
    li.id = "selected";
    li.blur();
    break;
    }
  }
}

They will appear in the head section like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
<!--
function showDate() {
  var d = new Date();
  document.write("<p>The <em>Universal Coordinated Time</em> is ");
  document.write(d.getUTCHours());
  document.write(":");
  document.write(d.getUTCMinutes());
  document.write(".</p>");
}
function showNavInSidebar(url) {
  var theLinks = document.getElementById("sidebar").getElementsByTagName('a');
  for( i=0; i < theLinks.length; i++ ) {
    var link = theLinks[i];
    if( link == url  ) {
      var last = document.getElementById("selected");
      if( last != null ) {
        last.className="";
        last.id="";
      }
    }
    var li = link.parentNode;
    li.className = "currentLink";
    li.id = "selected";
    li.blur();
    break;
    }
  }
}
// -->
</script>
</head>
<body>
...
</body>
</html>

external JavaScript

You can always use the special headAppend key to add JavaScript to the <head> element as in this example:

define. headAppend
<script src="${_ProjectRoot_}sidebarNav.js" type="text/javascript"></script>

general tag attribute specification {{ attr = function }}

To insert event handlers into tags use the general tag attribute modifier:

body{{onload="showNavInSidebar(document.URL)"}}.

p{{onmouseover="doSomething()"}}{color:blue;}. some text