lecture 8: script terminology
Some JavaScript tasks are too complex to be completely included inside tags. You still need to use a tag, and therefore an event handler, in order to start the task - the same old, "when X happens do Y". But sometimes Y is not completely described in the tag. Rather, the tag acts to "call" a longer sequence of instructions which is placed in the document header. This is known as a full script.
The following is a very simple script. It appears in the document header of this page (and also, along with the other code sample below, on your handout):
<script type="text/javascript"><!--
function yourname(whatname) { alert ("Hello, "+whatname+"!") }
--></script>
... and helps create the following trivial wheeze:
That form element is created by this code. Don't worry about anything else at this stage other than the onclick event:
<form action="">
<input name="Textbox" type="text" />
<input name="submit" type="button" value="What's your name?"
onclick="yourname(form.Textbox.value)" />
</form>
Because the output produced by this alert is variable, it can't be done with a simple object as used a few slides ago. What is actually happening here is that the onclick event is calling a function called "yourname" and is then passing it a value; defined by whatever's in the text box (that's what form.Textbox.value means; it refers directly to the name of that form element (more on this next week)). Values passed to functions like this are known as arguments.
This example is discussed in more detail in the online teaching materials. I know all this seems difficult, but you are not expected to memorise all this kind of thing. What I want to do is get you used to some general concepts, mainly:
- the use, placing and appearance of the <script> tag
- the idea of a function being enclosed in { and } (compare this with the way related sets of instructions are similarly coded into style sheets)
- the idea of the event passing an argument, or value, to the function to make it work.
If you can get used to these general concepts then you will be better placed to understand how to use ready-made JavaScripts - which is the topic of the next slide.
| 