Javascript learning records (BASICS)

Document directory

• Rules for JavaScript variable names:
• The rule is:
• Syntax
• Syntax:
• Syntax:
• Syntax:
• Syntax for creating a function:
• Javascript has two different types of loops:
• Event example:

What is JavaScript?

• Javascript is designed to add interactions to HTML pages.
• Javascript is a scripting language (scripting language is a lightweight programming language ).
• JavaScript consists of several lines of executable computer code.
• Javascript is usually directly embedded into HTML pages.
• Javascript is an interpreted language (that is, code execution is not precompiled ).
• All users do not need to buy a license to use JavaScript.

 

Document. WriteA field is a standard JavaScript command used to write output to a page.

 

When a page is loaded, Javascript in the body is executed.

When called, the JavaScript code in the head part is executed.

 

Javascript comments

You can add comments to explain JavaScript or improve its readability.

The comment of a single row starts.

 

Javascript multi-line comment

Multi-line comments start with/* and end.

 

Rules for JavaScript variable names:

• Variables are case sensitive (YAndYIs two different variables)
• The variable must startStart with a letter or underline

Note: javascript is case sensitive and variable names are also case sensitive.

 

Declare (create) JavaScript Variables

Variable creation in Javascript is often called a "Declaration" variable.

You can useVaR statementTo declare JavaScript variables:

var x;var carname;

Redeclare JavaScript Variables
If you declare a javascript variable again, the variable will not lose its original value.
var x=5;var x;
After the preceding statement is executed, the value of variable X is still 5. When the variable is declared again, the value of X is not reset or cleared.
 
Operator = is used to assign values.
Operator + is used for value adding.
Operator = is used to assign values to JavaScript variables.
Arithmetic Operator + is used to add up values.
y=5;z=2;x=y+z;
Javascript Arithmetic Operators
Arithmetic Operators are used to perform arithmetic operations between variables and/or values.
GivenY = 5, The following table explains these arithmetic operators:
 
 

  
  
 
   
 
    
Operator
 
    
Description
 
    
Example
 
    
Result
 
   
 
   
 
    
+
 
    
Add
 
    
X = Y + 2
 
    
X = 7
 
   
 
   
 
    
-
 
    
Subtraction
 
    
X = y-2
 
    
X = 3
 
   
 
   
 
    
*
 
    
Multiplication
 
    
X = y * 2
 
    
X = 10
 
   
 
   
 
    
/
 
    
Division
 
    
X = y/2
 
    
X = 2.5
 
   
 
   
 
    
%
 
    
Coefficient (Reserved integer)
 
    
X = Y % 2
 
    
X = 1
 
   
 
   
 
    
++
 
    
Accumulate
 
    
X = ++ y
 
    
X = 6
 
   
 
   
 
    
--
 
    
Decrease
 
    
X = -- y
 
    
X = 4
 
   
 
  
 
 
Javascript assignment operator
The value assignment operator is used to assign values to JavaScript variables.
GivenX = 10AndY = 5, The following table explains the value assignment operator:
 
 

  
  
 
   
 
    
Operator
 
    
Example
 
    
Equivalent
 
    
Result
 
   
 
   
 
    
=
 
    
X = y
 
    
 
 
    
X = 5
 
   
 
   
 
    
+ =
 
    
X + = y
 
    
X = x + y
 
    
X = 15
 
   
 
   
 
    
-=
 
    
X-= y
 
    
X = x-y
 
    
X = 5
 
   
 
   
 
    
* =
 
    
X * = y
 
    
X = x * y
 
    
X = 50
 
   
 
   
 
    
/=
 
    
X/= y
 
    
X = x/y
 
    
X = 2
 
   
 
   
 
    
% =
 
    
X % = y
 
    
X = x % Y
 
    
X = 0
 
   
 
  
 
 
+ Operator used for strings
+ Operators are used to add up (join) text values or string variables ).
To connect two or more string variables, use the + operator.
The rule is:
If you add a number to a string, the result is a string.
Comparison Operators
Comparison operators are used in logical statements to determine whether variables or values are equal.
Given x = 5, the following table explains the comparison operators:
 
 

  
  
 
   
 
    
Operator
 
    
Description
 
    
Example
 
   
 
   
 
    
=
 
    
Equal
 
    
X = 8 is false
 
   
 
   
 
    
===
 
    
Full (Value and type)
 
    
X = 5 is true; X = "5" is false
 
   
 
   
 
    
! =
 
    
Not equal
 
    
X! = 8 is true
 
   
 
   
 
    
>
 
    
Greater
 
    
X> 8 is false.
 
   
 
   
 
    
<
 
    
Less
 
    
X <8 is true
 
   
 
   
 
    
> =
 
    
Greater than or equal
 
    
X> = 8 is false
 
   
 
   
 
    
<=
 
    
Less than or equal
 
    
X <= 8 is true
 
   
 
  
 
 
Logical operators
Logical operators are used to determine the logic between variables or values.
Given x = 6 and Y = 3, the following table describes the logical operators:
 
 

  
  
 
   
 
    
Operator
 
    
Description
 
    
Example
 
   
 
   
 
    
&&
 
    
And
 
    
(X <10 & Y> 1) is true
 
   
 
   
 
    
|
 
    
Or
 
    
(X = 5 | Y = 5) False
 
   
 
   
 
    
!
 
    
Not
 
    
! (X = Y) is true
 
   
 
  
 
 
Conditional Operators
Javascript also contains conditional operators that assign values to variables based on certain conditions.
Syntax
variablename=(condition)?value1:value2 
 
  
  

   
   

     If statement 
   
   
   

     Run the code when a specified condition is set. 
   
   
   

     If... else statement 
   
   
   

     Execute the code when the specified condition is set. If the condition is not set, execute another code. 
   
   
   

     If... else if... else statement 
   
   
   

     You can use this statement to execute one of several block codes. 
   
   
   

     Switch statement 
   
   
   

     You can use this statement to execute one of several block codes. 
   
  
  
Warning box
The warning box is often used to ensure that users can obtain certain information.
When a warning box appears, you must click OK to continue the operation.
Syntax:
Alert ("text ")
<SCRIPT type = "text/JavaScript">
Function disp_alert ()
{
Alert ("I Am a warning box !! ")
}
</SCRIPT>

 
Confirmation box
The confirmation box enables users to verify or accept certain information.
After the confirmation box appears, you must click OK or cancel to continue the operation.
If you click OK, the return value is true. If you click Cancel, the returned value is false.
Syntax:
Confirm ("text ")
Function disp_confirm ()
{
VaR r = confirm ("press the button ")
If (r = true)
{
Document. Write ("you have followed the confirmation! ")
}
Else
{
Document. Write ("You have pressed cancel! ")
}
}
</SCRIPT>
Prompt box
The prompt box is often used to prompt users to enter a value before entering the page.
When the prompt box appears, you need to enter a value and click "OK" or "cancel" to continue the operation.
If you click OK, the returned value is the input value. If you click Cancel, the return value is null.
Syntax:
Prompt ("text", "default ")
<script type="text/javascript">
Function disp_prompt ()
{
VaR name = prompt ("enter your name", "Bill Gates ")
If (name! = NULL & name! = "")
{
Document. Write ("Hello! "+ Name +" How is today? ")
}
}
</SCRIPT>
How to define the syntax for creating a function:
Function Name (var1, var2,..., varx) {code ...}
Return Statement
The return statement is used to specify the value returned from the function.
Therefore, the function that needs to return a value must use this return statement.
 
Javascript has two different types of loops:
    
    

     
     

       For 
     
     
     

       Number of times a piece of code is cyclically executed 
     
     
     

       While 
     
     
     

       When the specified condition is true, the code is executed cyclically. 
     
    
    
Instance
    
    

     
     

       Break statement 
     
     
     

       Use the break statement to terminate the loop. 
     
     
     

       Continue statement 
     
     
     

       Use the continue statement to terminate the current loop and continue execution from the next value. 
     
    
    
 
For... in declaration is used to traverse the attributes of an array or object (loop operation on attributes of an array or object ).
for(VariableinObject)
{
Run the code here
}
 
Event example:
    
    

     
     
Click
     
     
Page or image loading
     
     
Hover your mouse over a hotspot on the page
     
     
Select input box in the form
     
     
Confirmation Form
     
     
Keyboard buttons
    
    
Onload and onUnload
When a user enters or leaves the page, the onload and onUnload events are triggered.
 
Onfocus, onblur and onchange
Onfocus, onblur, and onchange events are usually used together to verify the form.
The following is an example of using the onchange event. Once the user changes the domain content, the checkemail () function will be called.
<input type="text" size="30" id="email" onchange="checkEmail()">
 
Onsubmit
Onsubmit is used to verify all form fields before submitting a form.
<Form method = "Post" Action = "xxx.htm"onsubmit="return checkForm()">
 
Onmouseover and onmouseout
Onmouseover and onmouseout are used to create "dynamic" buttons.
<A href = "http://www.w3school.com.cn"
onmouseover="alert('An onMouseOver event');return false">  </a>
 
There are two ways to capture errors on a webpage:
    
    

     
     
UseTry... catchStatement. (Available in ie5 +, Mozilla 1.0, and Netscape 6)
     
     
UseOnerrorEvent. This is an old-fashioned method used to capture errors. (Available in Versions later than Netscape 3)
    
    
 
Try... catch statement
Try... catch can be used to test errors in the code. The try part contains the code to be run, and the catch part contains the code that runs when an error occurs.
 
The role of throw declaration is to create an exception (exception or error ).
try
{
If (x> 10)
throw "Err1"
Else if (x <0)
throw "Err2"
}
catch(er)
{
If (ER = "err1 ")
Alert ("error! The value is too high ")
If (ER = "err2 ")
Alert ("error! The value is too low ")
}
 
The following table lists other special characters that can be added to a text string using a backslash:

    
    

     
     
 
      
 
       
Code
 
       
Output
 
      
 
      
 
       
\'
 
       
Single quotes
 
      
 
      
 
       
\"
 
       
Double quotation marks
 
      
 
      
 
       
\&
 
       
And number
 
      
 
      
 
       
\\
 
       
Backslash
 
      
 
      
 
       
\ N
 
       
Line Break
 
      
 
      
 
       
\ R
 
       
Carriage Return
 
      
 
      
 
       
\ T
 
       
Tab
 
      
 
      
 
       
\ B
 
       
Escape Character
 
      
 
      
 
       
\ F
 
       
Page feed