JavaScript Basics Learning Notes

What is a variable?
A variable is a container for storing information
Declaration of a variable
Grammar:

var  Variable name

Variable name = value;
Variables must first be declared and then assigned
Variable can be assigned repeatedly
Naming rules for variables
The variable must start with a letter;
Variables can also start with the $ and _ symbols (although we do not recommend this);
Variable names are case sensitive (a and a are different variables).

Statement
The statement ends with a semicolon, or if the semicolon is omitted, the end of the statement is determined by the parser.
Have a good coding habit, all to; End

data type
in JavaScript , a piece of information is a value (value) . There are different types of values, and the most familiar types are numbers. A string (string) value is one or more words enclosed in quotation marks.
Numbers      any numeric value. Numbers can be numbered with decimal points, or they can be used without     68.57
characters in string      quotation marks. You can use single quotation marks or double quotes      "Hello, World"
Boolean (Boolean)      true or False     true
Undefined and null    undefined This value indicates that the variable does not contain a value. You can empty a variable by setting the value of the variable to null.     
Object      Any value associated with the object     
Function      The value returned by the function      

1 var // A is undefined 2 var // A is a number 3 var // A is a string

What is a function?
A function is a set of JavaScript statements that perform a task
Basic syntax:

function function name () {    function code;}

function name ();
Description
Functions define function keywords.
"Function name" the name you take for the function.
"Function code" is replaced with code that completes a specific function.
One of the "second function name" function calls

 1  function   Add2 () { 2  var  Sun = 3 + 2;  3  alert (Sun);  4   5  add2 (); //  

1 <  type= "button"  value= "click me"  onclick= "add2 ()"/ >2<!-- --

Output content (document.write)
document.write () outputs content directly from the Web page.
The first type: The output content is enclosed in "", directly Output "".

document.write ("I love javascript!");

The second type: through variables, output content

var mystr = "Hello World";d ocument.write (MYSRT); // Direct Write variable name, output variable stored content

The third type: output multiple items, the content is connected with the + number.

var mystr = "Hello"+ "I love Java Script"); // connect multiple items with a + sign

The fourth type: output HTML tags, and work, the label using "" enclosed.

var mystr= "Hello";d ocument.write (mystr+ "<br>"); // after the output hello, output a newline character document.write ("JavaScript");

Warning (Alert message dialog box)
When we visit the site, sometimes suddenly pop up a small window, which is written with a text message. If you do not click "OK", you can not do anything to the Web page, this small window is the use of alert implementation.
Syntax:alert (string or variable);

var mynum = +; alert ("hello!" ); alert (mynum);

Result: Popup message box in sequence (Alert popup message dialog contains a OK button)
Attention:
1. You cannot do anything else until you click the "OK" button in the dialog box.
2. Message dialogs are commonly used for debugging programs.
3. Alert output, can be a string or variable, similar to document.write

Confirm Selection (Confirm Message dialog box)
In addition to providing information to users, we also want to get information from users. The Confirm Message dialog box is used here.
The Confirm Message dialog box is often used to allow the user to make a selection action, such as: "Are you right?" such as A popup dialog box (including a OK button and a Cancel button).
Syntax: Confirm (str);
Parameter description: str: The text return value to display in the message dialog box: Boolean value
return value:
Returns True when the user taps the OK button
Returns False when the user taps the Cancel button
Note: By returning a value you can tell what button the user clicked.

1 <script type= "Text/javascript" >2     var mymessage=confirm ("Do you like JavaScript?") ); 3     if (mymessage==true) {4         document.write ("Good, Come on!")  5     }else{6         document.write ("JS powerful, to learn Oh!") ); 7     }8 </script>

Ask a question (Prompt message dialog box)
Sometimes, not only do you want users to answer yes/no. Instead, you want to get a more specific response. We can use prompt in this case.
The prompt pop-up message dialog box, typically used to ask some information that needs to interact with the user. Pop-up message dialog box (contains a OK button, Cancel button and a text input box).
Grammar:

Prompt (STR1,STR2);

Parameter description:
STR1: Text to display in the message dialog box, not modifiable
STR2: The contents of the text box can be modified
return value:
1, click the OK button, the contents of the text box will be returned as a function value
2. Click the Cancel button to return null

1 functionRec () {2     varScore;//The score variable is used to store the user-entered score values. 3Score = prompt ("Please enter your score", "90");4     if(score>=90){5document.write ("You're great!"));6}Else if(score>=75){7document.write ("Good Yo!"));8}Else if(score>=60){9document.write ("to refuel!"));Ten}Else{ Onedocument.write ("Work hard!")); A     }; -} ;

1 <script>2         var myName = Prompt ("Enter your Name"); 3           if null && MyName! = "") {4             document.write ("welcom to" + myName); 5         } Else {6             document.write ("Welcom to My Friend"); 7         }8 </script>

Open a new window (window.open)
Grammar:

window.open ([URL], [window name], [parameter string])

Parameter description:
URL: optional parameter to display the Web page's URL or path in the window. If this argument is omitted, or if its value is an empty string, then the window will not display any documents.
Window name: Optional parameter, the name of the window being opened.
1. The name consists of letters, numbers, and underscore characters.
2. Window name: Optional, this string is a comma-delimited list of features that declares the name of the window being opened. This can be _top, _blank, _selft, _parent , and so on.
_blank display destination page in new window
_selft Display destination page in current window
_parent The current entire window position in the frames page displays the destination page
_top frames page in the upper window to display the destination page
3. The same name window can only be created one, and to create multiple windows name cannot be the same.
4. name cannot contain spaces.
parameter string: Optional parameter, set window parameters, each parameter separated by commas.

Parameter table:
top number window top pixels off top of screen
left< /strong> Number window left the number of pixels on the left side of the screen
width number window width
height number window height br> menubar yes,no window There is no menu
toolbar yes,no window No toolbar
Scrollbars yes,no window has no scrollbar
status yes,no window has no status bar

1 <script type= "Text/javascript" >2      window.open (' http//', ' _blank ', ' width=300,height= 200,menubar=no,toolbar=no, Status=no,scrollbars=yes ')3 </script>

Close Window (window.close)
Close () Closes the window
Usage:

1 window.close (); // Close this window 2 < Window object >.close (); // closes the specified window

For example, close the newly created window.

1 <script type= "Text/javascript" >2     var// New Window object stored in variable Mywin  3    mywin.close (); 4 </script>

innerHTML Property
The InnerHTML property is used to get or replace the contents of an HTML element.
Grammar:

1 object.innerhtml

Object is an element object that gets an element, such as a document.getElementById ("ID").

1 <  ID= "Con">javascript</H2>

1 <Scripttype= "Text/javascript">2 varMyChar=document.getElementById ("Con");3 document.write ("Original title:"+mychar.innerhtml+"<br>"); //output original H2 label content4 　　 mychar.innerhtml="Hello World"5  　　 document.write ("Modified title:"+mychar.innerhtml); //H2 label content after output modification6 </Script>

Change HTML style
Grammar:

object.style.property=new style;

Note:object is an element that gets the element object, such as through document.getElementById ("id")

<id= "Con">I love JavaScript</H2  >

1 <script type= "Text/javascript" >2     var mychar= document.getElementById ("Con" ); 3     Mychar.style.color= "Red"; 4     Mychar.style.background= "#ccc"; 5     Mychar.style.width= "300px"; 6 </script>

Show and hide (Display properties)
Grammar:

Object.style.display = value

Value:
None This element is not displayed (and hidden)
Block This element will be displayed as a block-level element (that is, displayed)

Mychar.style.display = "Block"

Control class name (classname property)
The ClassName property sets or returns the class property of the element.
Grammar:

Object.classname = ClassName

Role:
1. Get the class attribute of the element
2. Specify a CSS style for an element within the page to change the appearance of the element

P2.classname = "both";

JavaScript Basics Learning Notes