Technologies underlying the web

Question 1

What is syntax?

Answer 1

The structure of statements in a computer language.

Question 2

Why is there a need to use JavaScript and CSS in the Web 2.0?

Answer 2

The Web 2.0’s content (constructed using HTML) has a style/layout (constructed using CSS) as well as a behaviour (controlled using JavaScript).

Question 3

What does the basic structure of an HTML document include?

Answer 3

1. Document type declaration
2. HTML tags
3. Head tags
4. Title tags (usually included in head so it titles the whole window)
5. Title of the page < h1 > < /h1 > (usually included in body)
6. Body tags
7. Paragraph tag < p > < /p > (usually included in body)

Question 4

How do you include CSS (as a file) in an HTML document?

Answer 4

Included in the head using the following syntax:

< link rel=”stylesheet” type=”text/css” href=”theme.css” >

Note: “theme.css” refers to a hypothetical CSS file.

Question 5

What kind of syntax could be included in a CSS file? (E.g. theme.css)

Answer 5

An example element could be:

h1 { color: green; } –> note the American spelling

Question 6

How do you include JavaScript (as a file) in an HTML document?

Answer 6

Included in the body using the following syntax:

< script src=”my_script.js” > < / script >

Question 7

How do you call a JavaScript function?

Answer 7

Identify the name of the function that was ‘called’/included in the HTML.
E.g. buttons can be specified in an HTML document using the following syntax:

< button type=”button” onclick=”myFunction()” >Date < / button >

In this case, you should state “myFunction();” in the JavaScript to call this function.

Question 8

What kind of syntax is included in a JavaScript file? (E.g. my_script.js)

Answer 8

The file would include the following syntax: 
function myFunction() {
document.getElementById("demo").innerHTML = Date();
}

Note: getElementById(“demo”) would refer to an element in the HTML with Id “demo” so for example,
< p id=”demo” > < / p >

Question 9

What are some useful things you can do with JavaScript?

Answer 9

JavaScript aids in giving the user more control over the browser. It allows the creation of:

• pop up alerts
• interactive attribute change (e.g. turning the bulb on & off)
• drawing pictures
• interactive text creation (e.g. commenting on blogs)
• updating parts of the page without loading the entire page again (e.g. ASOS and quick view)

Question 10

What are some things that should be considered when implementing JavaScript into an HTML document?

Answer 10

Different browsers may produce different results:

• JavaScript could be disabled by some end-users.
• Some commands only work in Internet Explorer and not other browsers.
• Versions of browsers matters.

Question 11

What are variables?

Answer 11

• Must be declared by the word var (e.g. var age = 42;) Also, 42 refers to the value which has been assigned to the variable.
• An example variable: a name might be a variable which takes the value “Frank”. BUT “Frank” is not the same variable as Name.

Question 12

What are some different types of variables?

Answer 12

• number
• string
• boolean
• object
• null
• undefined (nothing has been assigned)
• NaN (e.g. dividing by 0)

Question 13

What are some examples of pre-defined functions in JavaScript?

Answer 13

• pop up alerts (window will appear with your message to the end user of the website)
• date (always gets current date)

Question 14

How is a function defined in JavaScript?

Answer 14

1. Need the keyword ‘function’ to start defining.
2. A name for your choice for the function (e.g. showAge)
3. Open and close parenthesis after function name ()
4. Curly brackets {and} enclose all statements to execute as part of function.
5. All statements should end with a semi-colon ;

Question 15

Give an example of a defined function in JavaScript.

Answer 15

var age=42;
function showAge() {
alert("You are" + age); 
age= 65;
}

Question 16

What does a defined function essentially do?

Answer 16

Illustrates a set of commands to say how the function will operate when the function is called.
E.g. similar to the way a microwave’s function is defined in the specifications, it does not operate until the ‘start’ button is pushed so calling a function is the equivalent to pushing the ‘start’ button.

Question 17

What are the fundamental characteristics of HTML?

Answer 17

• A markup language that defines how the content is organised (i.e. concerned with display) SO the purpose isn’t defined.
• Contains predefined set of tags, attributes and values.
• Constructed upon a predefined basic structure.
• Lenient syntax (e.g. not case sensitive, ignores extra space, some tags don’t need closed, forgives many human errors).

Question 18

What needs does XML aim to fulfil?

Answer 18

Needs are born of the desire to make markup language more compatible across different applications/services, concentrating on structured representation of knowledge, so to achieve this there is a need for:

• Flexible extensible tags, attributes and values for different services.
• Embed/fixed ‘meaning’ to describe what the object is i.e. becoming self-descriptive for different applications.
• Structure to be defined by administrator to serve a specific purpose.
• Stricter syntax to allow exchange across applications and communities (e.g. case sensitive, extra space acknowledged, tags must be opened and closed, tags nested in right order, unforgiving of human errors).

Question 19

What does the basic structure of an XML document include?

Answer 19

1. Declaration of document type, version and encoding:
   < ?xml version=”1.0” encoding=”UTF-8”? >

The building blocks of XML are referred to as elements. An element consists of:

1. Opening tag (e.g. < child > ) i.e. the root
2. Closing tag (e.g. < / child >)
3. Content (anything included within the opening and closing tags) –> first tag included of content = child of root, then sub child etc.
4. Attribute(s) associated with the element (e.g. included in the opening tag could be < child name=”susie”> )
5. Value(s) of the attribute(s) (e.g. in this case “susie”)

Question 20

Give an example of an XML element which highlights that structure is determined by administrator.

Answer 20

Structure invented for context of “furniture”:

< table >
     < name >African Coffee Table< / name >
     < width >80< / width >
     < length >120< / length >
< / table >

In this case, a table is characterised by name, width and length. However, it doesn’t tell use if a height field can be included to conform to a table.

To make clear the rules for a table to a machine, a definition of a table has to be provided. This can be achieved with a DTD (document type definition) or an XML Schema.

Question 21

How is an attribute defined in XML syntax?

Answer 21

Values of attributes are assigned using an equal sign followed by value which must be in quotation marks (e.g. name=”Susie”)

Question 22

What are the rules associated with nesting in XML syntax?

Answer 22

• Elements respect hierarchy. (E.g. if you open a tag within the parent tags it mist be closed before the parents tag is closed):

< root >
< child name=”susie” >
< subchild >
...
< / subchild >
< / child >
< / root >

Elements must be nested properly.

Question 23

What does it mean for an XML document to be well-formed and valid?

Answer 23

• The document confirms to all the syntax rules = well formed.
• Conforms to the structure specified by either a 1) Document Type Definition (DTD) or 2) XML Schema = valid.