Unlike a Web browser, the JavaScript Server Pages compiler requires the use of proper XML markup because it internally relies on existing XML processing technologies. Any XML serialization of HTML is supported, including, but not limited to:
The validity of XHTML markup may be optionally verified using the XML schemas provided with this distribution. However, while the use of invalid XHTML, such as obsolete or non-existant tags and attributes, will be tolerated, it is mandatory that the mark-up be well-formed, since unparseable XML content will cause a compile-time error.
Although it is strongly recommended to use well-formed mark-up throughout your Web site, the well-formedness requirement applies only to JavaScript Client Pages, i.e. to any dynamic HTML code that will be rendered using the JSCP framework.
This implies that if your current Web site is written in HTML 4.x, or even unstructured "tag soup" that does not have a DTD or schema attached to it, you can still develop new content in JSCP without rewriting your existing code.
JavaScript code can be embedded into a page using a <?js ... ?> processing instruction, which is very similar to the way code is included into pages in PHP.
Given below are a few examples of how embedded code can be used
Unlike PHP, which outputs plain text to a stream, JavaScript Client Pages output proper DOM-generating code that has to construct a proper tree of elements, and the compiler relies on the input being well-formed XML.
Therefore, the following would be possible in PHP but not in JSCP:
Fortunately, in most cases, such code can be easily refactored to meet JSCP's XML well-formedness requirement.
In order to pass content or parameters to a page, a "parameters" object may be passed by the invoking code:
These parameters become accessible in the JavaScript Client Page via the input object. For instance, the firstName parameter would become input.first-name.
While embedded code is very easy to use in simple pages, in more complex scenarios, it may become rather unwieldy, especially given that as of now, there is no direct IDE support for JavaScript code embedded via processing instructions (e.g. code folding).
It is also important to note that the compiler does not understand JavaScript; nor does it detect JavaScript parse errors at compile time.
In order to address common scenarios requiring the use of control structures in templates, as well as outputting data, a number of extension elements have been provided in the JSClientPages namespace. These elements provide a cleaner way of representing
Element Name | js:output | ||||||||
---|---|---|---|---|---|---|---|---|---|
Description |
Outputs the value of a JavaScript expression.
The semantics of this expression are similar to <?js text(...) ?>. Important: Character strings without quotes are interpreted as identifiers rather than literal text. The use of undefined identifiers in JavaScript expressions will result in a runtime error. |
||||||||
Attributes |
|
||||||||
Occurs In |
|
Represents a condition construct, similar to if..else and if...then...else construct in programming languages.
This element can only be used to represent a single condition. Switches with multiple conditions will be discussed in the next section.
The JavaScript condition to be evaluated. The condition will be evaluated as if it were included directly in a JavaScript statement with 0s, null values, undefined values and empty strings or arrays being equivalent to false and everything else evaluating to true.
JavaScript code. Any characters or combinations of characters that have a special meaning in XML should be replaced with entities. Notable examples include "<", ">" and &.
input.employee.position == 'manager'
The block that will be evaluated and displayed if the condition is true. This block may contain any combination of mark-up, embedded code and other tags.
js:then may contain any of the following:
input.employee.position == 'manager'
</js:if>
The block that will be evaluated and displayed if the condition is false. Like js:then, js:else can contain code and markup.
input.employee.position == 'manager'
</js:if>
In JSCP, a switch is a series of conditions with attached code blocks where only one is expected to evaluate to true. Even in cases when two or more of the switch conditions are true, the first one takes precedence over the others.
In the most common case, switches check the value of a single variable against several possibilitiies in order to decide on a course of action. Given below is an example of this type of switch in JavaScript.
In JSCP, a similar switch can be implemented as follows:
Renders the same section of markup for every element of the specified JavaScript collection, which may be an array or an iterable object. The iteration will be implemented as a one of the following constructs depending on the type of object:
A reference to a JavaScript collection, i.e. an array or an enumerable object, over which this section will be iterating
The name of the iteration in which individual elements from the collection will be placed on every iteration. For instance, if the collection is named persons, it might be advisable to call the item person.
The name of the variable used to store one of the following:
The <js:forEach> element can contain any of the following: