JAVA Web Learning Note (ii)--javascript scripting language

3.1.1 What is JavaScript
JavaScript is an object-and event-driven, interpretative scripting language that has security performance and does not need to be compiled and embedded in HTTP pages, transforming static pages into dynamic pages that support user interaction and respond to application events.

Key features of 3.1.2 JavaScript
Explanatory, object-based, event-driven, security (does not allow access to local hard disks, cannot write data to the server, and does not allow modification and deletion of network documents), cross-platform
===============================================================================
Syntax for 3.2.1 JavaScript
A.javascript Case Sensitive
B. End of each line semicolon optional
Alert ("!")
Alert ("1");
The above two lines of code are correct. (It is best to add semicolons at the end of each line of statements to ensure the accuracy of the code)
C. Variables are weakly typed, and variables can be initialized to arbitrary values using the var operator only
var username= "Mrsoft"; Initializes the variable username to Mrsoft
var age=20; Initializes the variable age to 20
D. Marking blocks of code with curly braces
E. Notes
Single-line comment//...
Multi-line Comment/*......*/
3.2.2 keywords in javascript (cannot be used as variable name, function name, and loop label)
① keyword (keywords)
Break
Case
Catch
Continue
Default
Delete
Do
Else
Finally
For
function
If
Inch
instanceof
New
Return
Switch
This
Throw
Try
typeof
Var
void
While
With
② reserved Words (reserved words)
Abstract
Boolean
Byte
Char
Class
Const
Debugger
Double
Enum
Export
Extends
Final
Float
Goto
Implements
Import
Int
Interface
Long
Native
Package
Private
Protected
Public
Short
Static
Super
Synchronized
Throws
Transient
Volatile
3.2.3 JavaScript data types
JavaScript data types are relatively simple, mainly numeric, character, Boolean, transfer characters, null, undefined value of 6
A. Integral type
Can be a positive integer, a negative integer, and 0, and can be in decimal, octal, hexadecimal.
B. Floating-point type
consists of integers and decimals, only in decimal notation, but can be represented by the standard method scientific notation
......
F. Undefined value (undefined)
An undefined value is returned when you use a variable that is not declared, or if you use a variable that has been declared but not assigned a value (undefined)
Definition and use of 3.2.4 variables
......
Application of the 3.2.5 operator
......

3.3 Flow Control statements
......
==================================================================================
Definition of the 3.4.1 function
A function is defined by the keyword funtion, the function name plus a set of parameters, and a section of code that needs to be executed in curly braces. The basic syntax for defining a function is as follows:
function functionname ([parameter 1,parameter 2]) {
statements;
[Return expression;]
}
The parameters are described below.
functionname: Required to specify the function name. On the same page, the function name must be unique and case-sensitive.
parameter: Optional, used to specify the parameter list. When multiple parameter lists are used, the parameters are separated by commas. A function can have a maximum of 255 parameters.
statements: Required, is the function body, the statement used to implement function functions.
expression: optional, used to return function values. Expression is an arbitrary formula, variable, constant.
For example, define a function account () that calculates the amount of an item, which has two parameters, used to specify the unit price and quantity, and returns the calculated amount, with the following code:
function account (Price,number) {
var Sum=price*number;
return sum;
}
Invocation of the 3.4.2 function
Example: Account (10.6,10);

==================================================================================
3.5.1 What is an event handler
The interaction between JavaScript and the Web page is accomplished by triggering related events when the user operates the browser page.
3.5.2 JavaScript Common Events
Common non-return value events
Property Description
The loading of the onabort image is interrupted.
The onblur element loses focus.
The contents of the onchange domain are changed.
OnClick an event handle that is invoked when a user taps an object.
OnDblClick an event handle that is called when the user double-clicks an object.
OnError An error occurred while loading the document or image.
The onfocus element gets the focus.
OnKeyDown A keyboard key is pressed.
onkeypress A keyboard key is pressed and released.
OnKeyUp a keyboard key is released.
OnLoad a page or an image to finish loading.
OnMouseDown the mouse button is pressed.
OnMouseMove Mouse is moved.
onMouseOut the mouse to move away from an element.
onmouseover mouse moves over an element.
OnMouseUp mouse button is released.
The onreset reset button is clicked.
OnResize the window or frame is resized.
Onselect text is selected.
OnSubmit confirm button is clicked.
OnUnload user exits the page.
Returns the properties of the mouse or keyboard
Property Description
Altkey returns whether "ALT" is pressed when the event is triggered.
The button returns which mouse button is clicked when the event is triggered.
ClientX returns the horizontal coordinates of the mouse pointer when the event is triggered.
ClientY returns the vertical coordinate of the mouse pointer when the event is triggered.
Ctrlkey returns whether the "CTRL" key is pressed when the event is triggered.
Metakey returns whether the "meta" key is pressed when the event is triggered.
Relatedtarget returns the node associated with the target node of the event.
ScreenX returns the horizontal coordinates of the mouse pointer when an event is triggered.
ScreenY returns the vertical coordinates of the mouse pointer when an event is triggered.
Shiftkey returns whether the "SHIFT" key is pressed when the event is triggered.
When you specify an event handler in JavaScript, the event name must be lowercase to respond correctly to the event.

==================================================================================
3.6 Common Objects
3.6.1 Window Object
The Window object, which is a global object, is a top-level object of all objects that plays a pivotal role in JS.
The Window object provides a number of properties and methods that are called to manipulate the contents of a browser page.
The Window object, like the math object, does not require the new keyword to create an object instance, but directly uses the Format object name. Member to access its properties and methods.
Properties and methods for Window objects:
Format:

[Window.] Property

[Window.] Method (Parameters)

Opener. Properties

Opener. Methods (Parameters)

Self. Properties

Self. Method (parameter)

Parent. Properties

Parent. Method (Parameter)

Top. Properties

Top. Methods (Parameters)

Window name. Properties

Window name. Method (Parameter)
------------------------------------------
Common Properties for Window objects
------------------------------------------
Property Description
Document information for the current file
Information about the location's current URL
Name window names
Temporary information for status bar
Defaultstatus Status bar Default information
History recent pages viewed in this window
Closed determines whether the window is closed, returns a Boolean value
Opner Open method opens the window's source window
Outerheight Vertical dimensions of window boundaries, px
Outerwidth Horizontal dimensions of window boundaries, px
Pagexoffset Page x-position Location
pageYOffset Page y-position Location
Innerheight Vertical dimensions of the window content area, px
Innerwidth Horizontal dimensions of the window content area, px
ScreenX The x-coordinate of the left edge of the window
ScreenY the y-coordinate of the upper boundary of the window
Self Current window
Top-most window
Parent frame Group for current window or frame
Frames the frame corresponding to the window
Number of length frames
Locationbar Browser Address bar
MenuBar Browser menu bar
ScrollBars Browser scroll bar
StatusBar Browser status bar
Toolbar browser Toolbar
Offscreenbuffering whether to update areas outside the window
Personalbars Browser's personal toolbar, navigator only
--------------------------------------------------
Common Methods for Window objects
--------------------------------------------------
Method Properties
Alert (message string) Pop-up warning message
Confirm (Message string) Display confirmation Information dialog box
Prompt (prompt string [, default]) displays a prompt and provides fields that can be entered
Decoding of BASE-64 encoded strings by Atob (decoding string)
Btoa (String) will be base-64 encoded
Back () Return to previous page of history
Forward () load the next page in the history
Open (URL, window name [, Window size])
Focus () move to the window
Blur () window turns into background
Stop () stops loading web pages
Close () Closes the window
Enableexternalcapture () Allow frames for Windows to get events
Disableexternalcapture () off Enableexternalcapture ()
Captureevents (event type) capturing a specific event of a window
Routeevent (event) transfer of captured events
Handleevent (event) makes the processing of a particular event effective
Releaseevents (event type) to release acquired events
Moveby (level points, vertical points) relative positioning
MoveTo (x-coordinate, y-coordinate) absolute positioning
Setresizable (true|false) Whether window resizing is allowed
Resizeby (horizontal points, vertical points) relative to the window resizing
Resizeto (width, height) absolute resizing of Windows
Scroll (x-coordinate, y-coordinate) absolute scrolling window
Scrollby (level points, vertical points) relative scrolling window
ScrollTo (x-coordinate, y-coordinate) absolute scrolling window
SetInterval (expression, MS)
SetTimeout (expression, MS)
Clearinterval (Timer object)
Cleartimeout (Timer object)
Home () go to the homepage of your browser settings
Find ([string [, Casesensitivr,backward]]) finds a specific string in the window
Print ()
Sethotkeys (True|false) to activate or deactivate a key combination
Setzoptions () sets the stacking order when the window overlaps
---------------------------------------------------
Because the Window object's open () method and the close () method are often used in real-world Web site development, the following is a detailed explanation
1. Open method
Syntax format:
window.open (URL, window name, window style)

Function: Opens a new window and loads the Web page with the specified URL address in the window.

Description

The Open method opens a new browser window and loads a specified URL address in a new window;

Open method when opening a new browser window, you can also specify the name of the window (the second parameter);

Open method when opening a new browser window, you can also specify the style of the window (the third parameter),

The window style has the following options, these options can be multi-select, if multiple selection, the options are separated by commas:

Toolbar: Specifies whether the window has a standard toolbar. When the value of this option is 1 or yes, there is a standard toolbar that indicates that there is no standard toolbar when the value of this option is 0 or no;

Location: Specifies whether the window has an address toolbar, and the value and meaning of the option is the same as toolbar;

Directories: Specifies whether the window has a link toolbar, the value and meaning of the option is the same as toolbar;

Status: Specifies whether the window has a status bar, the value and meaning of the option is the same as toolbar;

MenuBar: Specifies whether the window has a menu, the value and meaning of the option is the same as toolbar;

ScrollBar: Specifies whether there are scroll bars when the current window document is larger than the window, and the value and meaning of the option is the same as toolbar;

Resizable: Specifies whether the window can be resized, and the value and meaning of the option is the same as toolbar;

Width: Specifies the width of the window in pixels, which has been replaced by innerwidth;

Height: Specifies the height of the window in pixels, which has been replaced by Innerheight;

Outerwidth: Specifies the external width of the window in pixels;

Outerheight: Specifies the external height of the window in pixels;

Left: Specifies, in pixels, the position of the window from the side of the screen;

Top: Specifies the position of the window from the top of the screen in pixels;

Alwayslowered: The specified window is hidden behind all windows, and the value and meaning of the option is the same as toolbar;

Alwaysraised: Specifies that the window floats above all windows, and the value and meaning of the option is the same as toolbar;

Dependent: Specifies that the open window is a subwindow of the current window, and that the value and meaning of the option are the same as the toolbar when the parent window is closed;

Hotkeys: Set the safe exit hotkey in a new window without the menu bar, the value and meaning of the option is the same as toolbar;

Innerheight: Sets the pixel height of the document in the window;

Innerwidth: Sets the pixel width of the document in the window;

ScreenX: Sets the pixel length of the window from the left edge of the screen;

ScreenY: Sets the pixel length of the window from the upper edge of the screen;

TitleBar: Indicates whether the title bar is visible in a new window, and the value and meaning of the option is the same as toolbar;

Z-look: Indicates that when a window is activated, it cannot float on top of other windows, and the value and meaning of the option are the same as toolbar.

The Open method returns a reference to the window.

Tip: This method is often used to automatically open another window when a Web page is opened.

2. The Close method

Syntax format:

Window.close ()

Function: The Close method is used to automatically close the browser window.
-----------------------------------------------
3.6.2 String Object
......
3.6.3 Date Object
......
==================================================================================
3.7 DOM (Document Object model) technology
Hierarchical structure of the 3.7.1 Dom
......
3.7.2 traversing a document
......
3.7.3 getting the elements in a document
......
3.7.4 Operating Documentation
......

JAVA Web Learning Note (ii)--javascript scripting language