1. Scripts Chapter 19-20

2. Scripts Small programs used to add interactivity to your web pages The backbone of Dynamic HTML (DHTML) Most scripts are written in JavaScript which is supported by most browsers The scripts will be inserted into the XHTML code when needed. JavaScript is actually a powerful and complex programming language. We will be learning only the basics.

3. Automatic Scripts Execute automatically when the page is loaded Run in the order in which they appear in the XHTML file. If the script is used in several different pages, then it can be saved in a separate file and “called” from any web page.

4. The script tag <script type=“text/javascript” language=“JavaScript” > The actual script itself goes here. <meta http-equiv=“content-type” Content=“text/html; charset=iso-8859.1”/> Simple Scripts document.write(“Visca Catalunya!”) Here’s the rest of the page.

5. The script tag <meta http-equiv=“content-type” Content=“text/html; charset=iso-8859-1”/> Accessing external scripts Here’s the rest of the page. <script type=“text/javascript” language=“JavaScript”> src=“extscript.txt”> The text file “extscript.txt” contains: document.write(“Visca Catalunya!”)

6. Triggered Scripts Script is executed only when intrinsic event occurs There are 18 pre-defined intrinsic events A user causes an intrinsic event to occur by performing some action (usually with the mouse) See next slide for list of intrinsic events

7. intrinsic events onloadthe page is loaded in the browserbody, frameset onunloadbrowser load a different page after specified page has loaded body, frameset onclickthe visitor clicks on the specified areaall elements except applet, base, basefont, br, font, frame, ondblclickthe visitor double clicks the specified areaframeset, head, html, iframe, meta, param, script, style,title onmousedownvisitor presses the mouse button down over the element same as for onclick/ondblclick onmouseupvisitor lets the mouse button go after having clicked on element same as for onclick/ondblclick onmouseovervisitor points the mouse at the elementsame as for onclick/ondblclick onmousemovevisitor moves mouse over element after pointing at it same as for onclick/ondblclick onmouseoutvisitor moves mouse away from element after being over it same as for onclick/ondblclick

8. onselectvisitor selects one or more chars or words in the element input(of type name or password), textarea onfocusthe visitor selects, clicks, or tabs to the specified element a, area, button, input, label, select, textarea onblurvisitor leaves an element that was previously in focus a, area, button, input, label, select, textarea onkeypressthe visitor types something in the specified element input(of type name or password), textarea onkeydownthe visitor types something in the specified element input(of type name or password), textarea onkeyupvisitor lets go of the key after typing in the specified element input(of type name or password), textarea onsubmitvisitor clicks the form’s submit buttonform (not input of type submit) onresetvisitor clicks the form’s reset buttonform (not input of type reset) onchangethe visitor modifies the value or contents of the element input, select, textarea intrinsic events (cont)

9. Not all browsers support scripts Use … element Llumi's big cat dreams end comments to hide scripts Your browser isn't running scripts, so you can't see what Llumi's thinking. Point at Llumi to see what she's thinking.

10. Hiding Scripts Older browsers –<script type=“text/javascript” <!— –littlecat=new image(143,83) –littlecat.src= “real.jpg” –bigcat = new Image(143,83) –bigcat.src = :dream.jpg” // a JavaScript comment -->

11. Hiding Scripts from XML Parsers <sxript<sxript <![CDATA[ document.write(“ etc … “) ]]>