[JS]Quick Review

Where to put JS in html

You can put your JS in , or external file and use to load it. External file does not include

var txt = "Hello";
/*
txt.length // it is 5
var x = txt.toUpperCase();
txt.indexOf()
txt.replace()
txt.search()
*/

4.Map

Map is mainly used for fast searching and looking up data.
Example: {(1, “smile”), (2, “cry”), (42, “happy”)}

Key and value in Map can be in any data type, not limited to only string or integer.

Object in Javascript has built-in prototype. Nearly all objects in Javascript are instances of Object, including Map.

Useful tips

1. Method and variable names are all Case Sensitive
2. Change line in string

document.write("Hello \
World!");

3. number +string will become string

x=5+"5";
document.write(x); //55
document.write("
");

4. Assign value to a variable that is not declared?
   It will automatically become a global variable even if it happens in the function.

carname="Volvo";

5. When using switch function, you need break in each case block otherwise it will keep executing until break, because switch only find the starting point.

DOM

(1)DOM can be used to edit every element in HTML

var x=document.getElementById("main");
//y is an array of paragraphs, you can use y[0].innerHTML
var y=x.getElementsByTagName("p");

(2)DOM to create/delete node

Paragraph 1
Paragraph 1

Paragraph 1

Paragraph 2

Onclick Event

(1)Use this to refer to the current element itself.

Current Line

This is the same as

Click on me

(2)Define the onclick directly

My first JavaScript


JavaScript can change the content and style of  HTML element.




Click Here

You can also set onclick for image and change the src.

element=document.getElementById('myimage')
element.src="/i/eg_bulbon.gif"

(3)Use DOM to assign an onclick event to an element.

Click Here

User Input

You will create an input box, and get the value and test if it is a number, if not, pop up an alert.

When to use document.write()

My Heading
Click Here

Correct way:

My heading

Other events:

• onload: when the use enter the webpage, usually used for checking versions of explores or something like that.

• onunload: used to deal with cookie

• onchange: usually combined with input

put some letters here：

When you done with inputs and click somewhere else，letters will be uppercased.

• onmouseover
• onmouseout
  首先当点击鼠标按钮时，会触发 onmousedown 事件，当释放鼠标按钮时，会触发 onmouseup 事件，最后，当完成鼠标点击时，会触发 onclick 事件。

Try - catch - throw

put a number in [5,10]：

Test your number