Zero-based front-end JavaScript Quick Start

JavaScript code can be directly embedded anywhere on the page, but usually we regard the JavaScript code into the <head>:

<html>
<head>
<script>
alert('Hello, world');
</script>
</head>
<http://www.my516.com>
...
</body>
</html>

. 1
2
. 3
. 4
. 5
. 6
. 7
. 8
. 9
10
. 11
a <script> ... </ script> is the code contains JavaScript code that will be executed directly to the browser.

The second method is to put a single JavaScript code .js file, then the HTML document that is introduced by <script src = "..."> </ script>:

<html>
<head>
<script src="/static/js/abc.js"></script>
</head>
<body>
...
</body>
</html>

. 1
2
. 3
. 4
. 5
. 6
. 7
. 8
. 9
Thus, / static / js / abc.js browser will be performed.

The JavaScript code in a separate .js file is more conducive to the maintenance code, and multiple pages can reference the same copy of each .js file.

May be introduced multiple .js files on the same page, you can also write <script> js Code ... </ script>, the browser in accordance with the order to perform multiple pages.

Sometimes you'll see a <script> tag also set up a type attribute:

<script type="text/javascript">
...
</script>

1
2
3
4
but this is not necessary, because the default type is JavaScript, so do not explicitly specify the type to JavaScript.

How to write JavaScript
can use any text editor to write JavaScript code. Here we recommend the following text editor:

Visual Studio Code
Microsoft out of the Visual Studio Code, can be seen as a mini version of Visual Studio, for free! Cross-platform! Built-in support for JavaScript, it is strongly recommended!

Text Sublime
Sublime Text is a text editor, easy to use, free of charge, but do not register will occasionally pop-up boxes.

++ Notepad
Notepad ++ is a free text editor, but use only under Windows.

Note: You can not use Word or Wordpad to write JavaScript or HTML, because after save formatted text instead of plain text files, and can not be properly read Browser. Also try not to present written notes, it will try to be smart save in UTF-8 format text when adding BOM head.

How to run JavaScript
to make the browser to run JavaScript, you must first have an HTML page, the introduction of JavaScript in the HTML page, and then let the browser loads the HTML page, you can execute JavaScript code.

You might want to create a good HTML and JavaScript files directly on my hard drive, then open the browser, you can not see the results yet?

In this way run some JavaScript code is no problem, but because of security restrictions browser to file: // addresses that begin with networking can not be executed as the JavaScript code in the end, you still need to set up a Web server, then http: // address beginning to perform all normal JavaScript code.

However, the beginning stages of learning, you do not care about the issue of how to build a development environment, we provide input JavaScript code and run directly in the page feature that allows you to focus on learning JavaScript.

Try click on "Run" button to perform the following JavaScript code:

Starts with a double slash // until the end of the line is a comment, the comment is posters, and will be ignored by the browser
/ * is in the middle of the comment and will be ignored by the browser * /
// The first JavaScript code:
1
2
3
browser will pop up a dialog box that displays "Hello, world". You can also modify the contents of the middle of the two single quotation marks, and then try to run.

Debugging
the saying goes, "we must first of its profits.", When writing JavaScript, if desired display ABC, results have shown that XYZ, in the end the code where the problem? Do not crazy, do not be discouraged, as white, to believe: JavaScript itself is no problem, no problem browser execution, there is a certain problem is my code.

How to find the code in question? This requires debugging.

How do debug JavaScript code in the browser?

First, you need to install the Google Chrome browser, Chrome browser developers are very friendly, allowing you to easily debug JavaScript code. Download Chrome browser from here. Open the pages of children's shoes please move on domestic problems mirror.

Once installed, just open a web page, then click the menu "view (View)" - "developer (Developer)" - "Developer Tools (Developer Tools)", a browser window will be divided into two, that is, below the developer tool:

 

Click on "Console (Console)", the JavaScript code can be entered directly in the panel, perform press Enter.

To view the contents of a variable, input console.log (a) in Console ;, the value of the content is displayed after the transport of the variable.

Close Console, please click the upper right corner of the "×" button. Please use Console's master, when writing JavaScript code, often you need to test the code in the Console run.

If you yourself have higher requirements, can be studied developer tools' source (Sources) ", master breakpoints, single stepping and other advanced debugging techniques.
--------------------- 

Guess you like

Origin www.cnblogs.com/hyhy904/p/10983057.html