PIC40A Review Notes
The notes may be updated later. You are responsible for checking new updates.
Last updated: 2/11 11:00 pm
Format of the exam
- One A-4 size handwritten cheat sheet (both side can be used)
- 4 questions
- finding output of html file or javascript
- write html file
- write javascript program
- write CSS file
- find mistakes of html files or javascript
- The exam may be long. You have to be very familiar with the material
and can answer any question immediately!
Basic Unix
- how to create a folder?
- how to made it accessible? (chmod 755 folder)
- how to change folder? (cd)
- how to list file in a folder? (ls)
- how to made a file accessible (chomod 644 filename)
Basic HTML
W3C standard
Common mistakes
- forget end tag
- use uppercase letter
- <br>(should be <br />)
- no quotation in value of attributes (e.g. size=5, should be size="5")
- non-standard tag or attributes.
Other stuff you should know
- p, br, h1, h2, ..., blockquote, code, em, strong, b, i, sub, sup , tt, pre, hr
- specical charater e.g. >, < & should be written as >, <, &
- img: understand src, alt, height, width
- link:
- reltaive URL vs alsolute URL
- a tag
- understand id, example <h2 id="section1"> Section 1 <h2>, then
<a href="#section1"> Link to section 1 <a> will take you to the
section on the same page.
- list: ul, ol, li, dl, dt
- table:
- caption, th, tr, td
- rowspan, colspan
- border, cellspacing, cellpadding
- frame:
- e.g. <frameset cols="40%, 20%, 40%"> or
<frameset cols="200, *">
- how to use frame
- how to use name attribute in frame
- how to use target attribute in a tag
CSS
- learn 3 different ways to define CSS: (1) use inline, (2) in the head
(3) external file. Understand the rules to determine which style should be used
if the same tag is defined twice.
- know the basic sytac
- Only matrial from the book (except 3.5.5 and 3.7) will be tested
- Color and background image: read section 3.5.1 and 3.6
- understand style classes, how to define them, how to use them. there are 2 types.
Javascipt
Basic
- how to use script tag
- comment in javascript
- how to input other javascript file
- what is the difference beteen javascript in head tag and body tag
- functions are usually put in the head tag
- alert, confirm (return true or false), prompt(return a string)
- document.writeln, document.write
- how to define variables
- type can be changed easily
- parseFloat, parseInt
- use isNaN to test if something is not a number
- Math: understand different methods, e.g. max, floor, etc, see the book
- String:
- integer, numbers, etc can be added to strings
- understand the methods listed in the book, charAt, indexOf, substring, toLowerCase, toUpperCase
== vs ===
Function
- how to write a function
- better put between head tag
Object
- similar to structure
- how to create an object? Object x = new Object()
- assignment: x.somename = ...
- can use x["somename"] to access the data
- delete x.somename
- understand for(var name in x)
Array
- how to define, declare an array
- how to access and array
length
- elements can be
undefined
- join, sort, slice, pop, push, reverse
Form
html
- understand form tag
- understand different input type
- text, password, file
- checkbox, radio buttons
- textarea
- select
- button, submet, reset
- textarea
- understand name
- understand value
Event
- onclick, onchange, onfoucs, onsubmit(for form and submit button),
onmouseover, onmouseout
How to access tag in javascript
- use id,
document.getElementById(some_id,
need id attribute for the tag
- use index,
- doucment.forms[i] (the i-th form)
- document.forms[i].elements[j] (the j-th element of the i-th form)
- document.images[i] (the i-th image
- use name
- document.name
- document.forms[i].name
What can you change?
- background image: document.body.background
- background color: document.bgColor
- src of an image: img.src, in general, tag.atribute.
e.g. img.alt, some_text_field.value
- style: tag.style.style_property e.g.
if <h3 id="abc" style="color:yellow;background:#223344;font-family:arial" >
Then document.getElementById("abc").style.color = red can change color.
document.getElementById("abc").style.fontFamily = ... can change the font.
Notice that font-family has a "-" between words, so we have to remove it and use upper case F.
- class: use tag.style.className
- value: tag.value