Summary of knowledge points in the JavaScript getting started series and javascript knowledge points

Summary of knowledge points in the JavaScript getting started series and javascript knowledge points

JavaScript is a literal-literal scripting language. It is a dynamic, weak, prototype-based language with built-in support types. Its Interpreter, called the JavaScript engine, is a part of the browser and is widely used in the script language of the client. It was first used on HTML (an application under the standard General Markup Language) web pages, it is used to add dynamic functions to HTML webpages.

I. preparations:

1. Why Learning JavaScript?

All mainstream browsers are Javascript

Most Web pages use Javascript

It allows the webpage to display various dynamic effects.

Easy to learn

2. How to insert JS

<Script> tags must appear in pairs and JavaScript code should be written between <script> </script>.

<Script type = "text/javascript"> indicates that text is used between <script> </script> ), javascript is used to tell the browser that the text is in the JavaScript language.

3. Reference JS external files

The HTML file and JS Code can be separated and a JavaScript file (JS file for short) can be created separately. The file suffix is usually. js.
In the JS file, you can directly write JavaScript code without the <script> tag.

Copy codeThe Code is as follows:
<Script src = "script. js"> </script>

4. JS location on the page

Javascript, as a scripting language, can be placed anywhere on an html page. Generally, it is placed in the head or body of a webpage. However, when the browser interprets html, the script is executed first. For example, JavaScript code for page display initialization must be placed in the head, because initialization must be performed in advance (such as setting css for the page body ); if the function is called through an event, there is no requirement on the location.

5. Statements and symbols

JavaScript code format: Statement;

6. annotation Method

Single line comment. Add the symbol "//" before the comment content.

Multi-line comments start with "/*" and end.

7. Variables

Use the keyword var to define variables. The syntax is as follows:

Var variable name

Variable names can be named at will, but follow the naming rules:

1. The variable name must start with a letter or underscore.

2. The variable name must consist of letters, numbers, and underscores.

3. JavaScript keywords and reserved words cannot be used for variable names.

8. Judgment Statement (if... else)

Syntax:

If (condition) {code executed when the condition is set} else {code executed when the condition is not met}

9. Functions

Function Name () {function Code ;}

Note:

1. function-Defined function keywords.

2. "function name": Your name for the function.

3. Replace "function code" with code that completes a specific function.

Function call:

After a function is defined, it cannot be automatically executed. Therefore, you only need to write the function directly at the desired position to call it.

2. Common interaction Methods

1. Output content (document. write)

Document. write () can be used to directly output the stream content to HTML. Simply put, the content is output directly on the webpage.

First, the output content is enclosed by "" and the content in "" is directly output.

Type 2: Output content through Variables

Third: Output multiple items and connect the content with the "+" sign.

Type 4: Output HTML tags and take effect. The tags are enclosed.

2. Warning (alert message dialog box)

A small window is displayed, with a text prompt (alert pop-up message dialog box (including a confirmation button): alert (string or variable );

Note:

1. You cannot perform any other operations before clicking "OK" in the dialog box.

2. message dialog boxes can be used to debug programs.

3. alert output content, which can be a string or variable, similar to document. write.

3. confirm (confirm message dialog box)

A dialog box (including a confirmation button and a Cancel button) is displayed ). Confirm (str );

Parameter description:

Str: Text to be displayed in the message dialog box

Return Value: Boolean Value

Return Value:

Returns true if you click OK.

If you click "cancel", false is returned.

Note: the return value can be used to determine the button clicked by the user.

Note: The message dialog box is exclusive. You cannot perform any other operations before clicking the dialog box button.

4. Question (prompt message dialog box)

The pop-up message dialog box (contains a confirmation button, a Cancel button, and a text input box) prompt (str1, str2 );

Parameter description:

Str1: the text to be displayed in the message dialog box cannot be modified.

Str2: Content in the text box, which can be modified

Return Value:

1. Click OK. The content in the text box is used as the function return value.

2. Click Cancel to return null.

Note: you cannot perform any other operations before clicking the button in the dialog box.

5. open a new window (window. open)

The open () method is used to open a new window: window. open (<URL>, <window Name>, <parameter string>)

Parameter description:

URL: Enter the URL or path of the window.

Window name: the name of the Opened Window.

It can be "_ top", "_ blank", and "_ selft.

Parameter string: Set window parameters separated by commas. (Top, left, width, height, menubar, toolbar, scrollbars, status)

Note:

1. There are spaces before and after the comma and equal sign between parameters. This string is invalid and can run normally only when spaces are deleted.

2. browser compatibility is considered for running results.

6. close the window (window. close)

Window. close (); // close the specified window

<Window Object>. close ();

3. DOM operations

1. Understand DOM

The Document Object Model DOM (DOM) defines the standard methods for accessing and processing HTML documents. DOM presents HTML documents,

Tree Structure of attributes and text (node tree ).

1. Element nodes: Both

2. Text node: content displayed to users, such as JavaScript, DOM, CSS, and other text in <li>... </li>.

3. Property node: Element property, such as the link property href = "http://www.imooc.com" of the <a> label ".

2. Get elements by ID

Document. getElementById ("id ")

Note: The retrieved element is an object. to operate an element, we need to use its attributes or methods.

3. innerHTML attributes

The. innerHTML attribute is used to obtain or replace the content of HTML elements.

Object. innerHTML

1. An Object is an acquired Element Object, for example, an element obtained through document. getElementById ("ID.

2. Pay attention to writing. innerHTML is case sensitive.

4. Change the HTML Style

Object. style. property = new style;

Note: An Object is an element Object obtained through document. getElementById ("id.
Basic Attribute Table (property );

BackgroundColor/height/width/color/font/fontFamily/fontSize

5. Display and hide)

Object. style. display = value

Note: An Object is an element Object obtained through document. getElementById ("id.

Value:

None: This element is not displayed (hidden)

Block: This element is displayed as a block-level element (displayed)

6. control class name (className attribute)

Sets or returns the class attribute of an element.

Object. className = classname

1. Get the class attribute of the element

2. Specify a css style for an element in the webpage to change the appearance of the element.

Articles you may be interested in:

• Javascript knowledge collection
• Javascript Excel operation knowledge point
• Summary of important JS knowledge points
• The "this pointer" Application of Javascript knowledge points you must know
• The usage of "single-thread event-driven" based on Javascript knowledge points you must know
• Summary of basic knowledge points of JavaScript language (mind map)
• 21 Basic knowledge points of JavaScript
• Summary of common js + jquery knowledge points