18 Scripts

18.1 Introduction to Scripts

A client script is a program that can accompany an HTML document or directly be embedded into it. This program is run on the client machine when the document is loaded or at another time, for example, when the link is activated. Support for scripts in HTML does not depend on the language of the script.

Scripts offer authors tools to enhance the interactivity of HTML documents. For example:

  • Scripts can be evaluated at the time of document loading and dynamically change the contents of the document.
  • Scripts can be used in a form to process input data. Designers can dynamically fill out form fields depending on the values ​​of other fields. They can check whether the entered data falls within a predetermined range of values, the correspondence of fields, etc.
  • Scripts can be included by events that affect the document, for example, by loading, unloading, element focus, mouse movement, etc.
  • Scripts can communicate with the control elements of the form (for example, with buttons) to represent the elements of the user interface.

Authors can attach to the document HTML two types of scripts:

  • Scripts that execute once when the document is loaded by the user agent. The scripts described in the SCRIPT element are executed when the document is loaded. For user agents that do not handle scripts, authors can define alternative content using the NOSCRIPT element.
  • Scripts that are executed every time a certain event occurs. These scripts can be assigned to a number of elements using the attributes of internal events .

Note. For more information, see the sections on script macros .

18.2 Developing documents for user agents that support scripts

The following sections relate to user agents that support scripts.

18.2.1 SCRIPT Element

  <! ELEMENT SCRIPT - - % Script;
  - expression script ->
 <! ATTLIST SCRIPT
  Charset% Charset;
  #IMPLIED - character encoding of the associated resource -
  Type % ContentType;
  #REQUIRED - the content type of the language scripts -
  Language CDATA #IMPLIED - predefined name of the language of the serial -
  Src % URI;
  #IMPLIED - URI of external script -
  Defer (defer) #IMPLIED - User agent may delay execution of the script -
  >

Start tag: required , End tag: required

Attribute definitions

Src = uri [CT]
This attribute specifies the location of the external script.
Type = content-type [CI]
This attribute specifies the script language for the content of the element and takes precedence over the default script language. The script language is specified as the content type (for example, "text / javascript"). Authors must specify the value of this attribute. The default value for this attribute is not set.
Language = cdata [CI]
Undesirable. This attribute specifies the script language for the content of this element. Its value is the language identifier, but since the identifiers are not standardized, this attribute is undesirable, instead of it you need to use the type attribute.
Defer [CI]
If this logical attribute is set, it provides a hint to the user agent that the script will not generate document content (for example, "document.write" in javascript) and thus the user agent can continue parsing and presenting the document.

Attributes defined elsewhere

The SCRIPT element places the script in the document. This element may appear several times in the HEAD or BODY element of the HTML document.

The script can be defined in the content of the SCRIPT element or in an external file. If the src attribute is not set, the user agents must interpret the content of the element as a script. If the URI is set for the src attribute, user agents must ignore the contents of this element and load the script through the URI. Note that the charset attribute refers to the character encoding of the script assigned by the src attribute; It does not refer to the contents of the SCRIPT element.

Scripts are evaluated by the core of the script, which the user agent must know.

The syntax of the script data depends on the script language.

18.2.2 Specifying the language of the script

Because the HTML document does not imply a specific script language, the authors of the document must explicitly tell the user agents the language of each script. This can be done by declaring a script by default or by using a local declaration.

Default Script Language  

Authors should specify the default scripting language for all scripts in the document by including the following META declaration in the HEAD tag:

  <META http-equiv = "Content-Script-Type" content = "type">

Where "type" is the content type that names the script language. Examples of values ​​are "text / tcl", "text / javascript", "text / vbscript".

If there is no META declaration, the default value can be set using the HTTP header "Content-Script-Type".

  Content-Script-Type: Type

Where "type" is the content type that names the language of the script.

User agents must specify the default script language for the document in accordance with the following actions (priority from highest to lowest):

  1. If you specify "Content-Script-Type" in the META declaration, the default script language is set by the last such declaration in the symbol stream.
  2. Otherwise, if "Content-Script-Type" is specified in the HTTP headers, the default script language is set by the last such declaration in the symbol stream.

Documents that do not specify the default script language, but contain elements that specify internal events , are incorrect. User agents may attempt to interpret incorrectly defined scripts, but this is not necessary. Development tools should generate information about the default script language to avoid creating incorrect documents.

Local script language declaration  

The script language can be specified in each SCRIPT element using the type attribute . If no default script language is specified, this attribute must be set for each SCRIPT element. If the default script language is specified, the type attribute takes precedence over it.

In this example, we declare the default scripting language: "text / tcl". The SCRIPT element is included in the header, the script itself is in an external file and uses the language "text / vbscript". In addition, one SCRIPT element is in the body of the document and contains another script written in the language "text / javascript".

  <! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.0 // EN"
  "Http://www.w3.org/TR/REC-html40/strict.dtd">
 <HTML>
 <HEAD>
 <TITLE> Document with scripts </ TITLE>
 <META http-equiv = "Content-Script-Type" content = "text / tcl">
 <SCRIPT type = "text / vbscript" src = "http://someplace.com/progs/vbcalc">
 </ SCRIPT>
 </ HEAD>
 <BODY>
 <SCRIPT type = "text / javascript">
 ... the JavaScript code ... </ SCRIPT>
 </ BODY>
 </ HTML>

Links from the script to HTML elements  

Each scripting language has its own conventions regarding references to HTML objects in the script. This specification does not define a standard mechanism for referring to HTML objects.

However, scripts must reference elements in accordance with the name assigned to them. The script kernel must follow the following priority rules when identifying an item: the name attribute takes precedence over the id attribute if both of these attributes are set. Otherwise, the installed attribute is used.

18.2.3 Internal Events

Note. We inform authors of HTML documents that in the field of internal events (for example, in linking scripts to events) changes are very likely. Work in this area is carried out by members of the W3C Document Object Model Working Group (for more information, see the W3C website at http://www.w3.org/ ).

Attribute definitions

Onload = script [CT]
The onload event occurs when the user agent finishes loading a window or all FRAMESET frame frames. This attribute can be used in BODY and FRAMESET elements.
Onunload = script [CT]
The onunload event occurs when the user agent deletes the window or frame document. This attribute can be used in BODY and FRAMESET elements.
Onclick = script [CT]
The onclick event occurs when the button on the element is clicked once. This attribute can be used with most elements.
Ondblclick = script [CT]
The ondblclick event occurs when the pointing device button on the element is double-clicked. This attribute can be used with most elements.
Onmousedown = script [CT]
The onmousedown event occurs when the button of the pointing device on the element is clicked. This attribute can be used with most elements.
Onmouseup = script [CT]
The onmouseup event occurs when the button of the pointing device is released on the element. This attribute can be used with most elements.
Onmouseover = script [CT]
The onmouseover event occurs when the pointing device is moved to an item. This attribute can be used with most elements.
Onmousemove = script [CT]
The onmousemove event occurs when the pointing device is moved when it is on the element. This attribute can be used with most elements.
Onmouseout = script [CT]
The onmouseout event occurs when the pointing device is moved beyond the element. This attribute can be used with most elements.
Onfocus = script [CT]
The onfocus event occurs when the focus element receives the item using a pointing device or a transition sequence. This attribute can be used with the following elements: LABEL , INPUT , SELECT , TEXTAREA and BUTTON .
Onblur = script [CT]
The onblur event occurs when the focus moves from this element using a pointing device or a transition sequence. It can be used with the same elements as onfocus .
Onkeypress = script [CT]
The onkeypress event occurs when you press and release a key on an element. This attribute can be used with most elements.
Onkeydown = script [CT]
The onkeydown event occurs when a key is pressed on an element. This attribute can be used with most elements.
Onkeyup = script [CT]
The onkeyup event occurs when a key is released on an element. This attribute can be used with most elements.
Onsubmit = script [CT]
The onsubmit event occurs when the form is submitted. It is used only in the FORM element.
Onreset = script [CT]
The onreset event occurs when the form is reset. It is used only in the FORM element.
Onselect = script [CT]
The onselect event occurs when the user selects some text in the text field. This attribute can be used with INPUT and TEXTAREA elements.
Onchange = script [CT]
The onchange event occurs when the control element is lost by the control element of the input focus, if its value was changed from the moment of receiving the focus. This attribute is used with the following elements: INPUT , SELECT, and TEXTAREA .

The action can be associated with a certain number of events that occur when the user interacts with the agent. The value of each of the above "internal events" is a script. This script is executed if this event occurs for this item. The syntax of the script depends on the language of the script.

Controls such as INPUT , SELECT , BUTTON , TEXTAREA and LABEL respond to internal events. If they are not displayed in the form, they can be used to improve the graphical interface of the document.

For example, authors can include buttons in the documents that are not used to send the form, but when they click, there is some interaction with the server.

The following example shows the possible behavior of the control element and the user interface, depending on the internal events.

In this example, userName is a required text field. If the user does not fill in this field, the onblur event calls the JavaScript function to check the value of the userName field.

  <INPUT NAME = "userName" onblur = "validUserName (this.value)">

Here's another example of JavaScript:

  <INPUT NAME = "num"
  Onchange = "if (! CheckNum (this.value, 1, 10)) 
  {This.focus (); this.select ();} else {thanks ()} "
  VALUE = "0">

Here is an example of an event handler for a text field in the VBScript language:

  <INPUT name = "edit1" size = "50"> 
  <SCRIPT type = "text / vbscript">
  Sub edit1_changed ()
  If edit1.value = "abc" Then
  Button1.enabled = True
  Else
  Button1.enabled = False
  End If
  End Sub
  </ SCRIPT>

Here is the same example using Tcl:

  <INPUT name = "edit1" size = "50">
  <SCRIPT type = "text / tcl">
  Proc edit1_changed {} {
  If {[edit value] == abc} {
  Button1 enable 1
  } Else {
  Button1 enable 0
  }
  }
  Edit1 onChange edit1_changed
  </ SCRIPT>

Here is an example of binding an event inside a JavaScript script. To get started, a simple mouse click handler:

 
 <BUTTON type = "button" name = "mybutton" value = "10">
 <SCRIPT type = "text / javascript">
  Function my_onclick () {
  .  .  .
  }
  Document.form.mybutton.onclick = my_onclick
  </ SCRIPT>
  </ BUTTON>

Here's a more interesting window handler:

 
 <SCRIPT type = "text / javascript">
  Function my_onload () {
  .  .  .
  }
  Var win = window.open ("some / other / URI")
  If (win) win.onload = my_onload
 </ SCRIPT>

In the Tcl language, it looks like this:

  <SCRIPT type = "text / tcl">
  Proc my_onload {} {
  .  .  .
  }
  Set win [window open "some / other / URI"]
  If {$ win! = ""} {
  $ Win onload my_onload
  }
  </ SCRIPT>

Note that the expression "document.write" or equivalent expressions in internal event handlers create and write to a new document, and does not change the current one.

18.2.4 Dynamically changing documents

Scripts that are executed when the document is loaded can dynamically change the contents of the document. This possibility depends on the script language itself (for example, the expression "document.write" in the HTML object model is supported by some manufacturers).

Dynamic document modification can be modeled as follows:

  1. All SCRIPT elements are evaluated in order when the document is loaded.
  2. All script constructs in this SCRIPT element that generate SGML CDATA are evaluated. The generated text is inserted into the document instead of the SCRIPT element.
  3. The generated CDATA is reevaluated.

HTML documents are limited to the requirement that HTML DTDs match before and after the processing of SCRIPT elements.

The following example shows how scripts can dynamically modify a document. The following script:

  <TITLE> Test document </ TITLE>
  <SCRIPT type = "text / javascript">
  Document.write ("<p> <b> Hello World! <\ / B>")
  </ SCRIPT>

Has the same effect as the HTML markup:

  <TITLE> Test document </ TITLE>
  <P> <B> Hello World! </ B>

18.3 Developing documents for user agents that do not support scripts

The following sections discuss creating documents for user agents that do not support scripts.

18.3.1 NOSCRIPT Element

  <! ELEMENT NOSCRIPT - - ( % block; ) +
  - alternative content for presentation without scripts ->
 <! ATTLIST NOSCRIPT
  % Attrs;
  - % coreattrs , % i18n , % events -
  >

Start tag: required , End tag: required

The NOSCRIPT element allows authors to specify alternative content when the script is not executed. The contents of the NOSCRIPT element must be generated by user agents that support scripts only in the following cases:
  • The user agent is configured to not run scripts.
  • The user agent does not support the scripting language used by the SCRIPT element.

User agents that do not support client scripts must represent the contents of this element.

In the following example, the user agent that executes the SCRIPT element will include dynamically created data in the document. If the user agent does not support scripts, the user can download this data by reference.

  <SCRIPT type = "text / tcl">
  ... a script in Tcl to insert data ... </ SCRIPT>
 <NOSCRIPT>
  <P> Data access <A href="http://someplace.com/data">. </A>
 </ NOSCRIPT>

18.3.2 How to hide a script from user agents

User agents that do not recognize the SCRIPT element can present it as text. Some script kernels, including kernels for JavaScript, VBScript and Tcl, allow you to include script expressions in the SGML comment. User agents that do not recognize the SCRIPT element will ignore comments, and the script engine will detect and execute it.

Another solution to this problem is to store scripts in external documents and reference them using the src attribute.

Commenting on JavaScript scripts
The JavaScript kernel allows the use of the string "<! -" at the beginning of the SCRIPT element and ignores further characters, to the end of the line. JavaScript interprets the "//" character as the beginning of a comment that continues to the end of the current line. It is necessary that the string "->" is not understood by the JavaScript parser.

  <SCRIPT type = "text / javascript">
 <! - Hide the contents of the script from older browsers
  Function square (i) {
  Document.write ("Call passed,", i, "to function.", "<BR>")
  Return i * i
  }
  Document.write ("The function returned", square (5), ".")
 // end of hidden content ->
 </ SCRIPT>

Commenting scripts in VBScript
In VBScript, the comment is all text, starting with the single-quote character to the end of the line. This can be used to comment the line "->" from VBScript, for example:

  <SCRIPT type = "text / vbscript">
  <! -
  Sub foo ()
  ...
  End Sub
  '->
  </ SCRIPT>

Commenting on TCL scripts
In Tcl, the comment is the text from the "#" character to the end of the line:

  <SCRIPT type = "text / tcl">
 <! - Hide the contents of the script from older browsers
  Proc square {i} {
  Document write "The call passed $ i to the function. <BR>"
  Return [expr $ i * $ i]
  }
  Document write "The function returned [square 5]."
 # End of hidden content ->
 </ SCRIPT>

Note. Some browsers consider the first character ">" as the end of the comment. In this case, you can transfer the operands for the relational and shift operators (for example, using "y <x" instead of "x> y") or use the methods of traversing the character ">" in the script language.