1, JavaScript overview:
1. JavaScript is a scripting language that runs on browsers. JS for short.
JavaScript was developed by Brandon Archie of NetScape (the father of JavaScript), originally called LiveScript.
The emergence of LiveScript makes the browser more vivid and no longer a simple static page. Pages are more interactive.
At some stage in history, SUN and Netscape had a cooperative relationship. SUN changed the name of LiveScript to JavaScript.
Although JavaScript has "Java" in its name, it has nothing to do with Java, but has similar syntactic advantages. They run in different locations,
Java runs in the JVM and JavaScript runs in the browser's memory.
2. JavaScript programs do not need to be compiled manually by our programmers. After writing the source code, the browser will directly open it for interpretation and execution.
The "target program" of JavaScript is saved in the form of ordinary text, which is called "scripting language".
The target program of Java has been class exists in form and cannot be opened with a text editor. It is not a scripting language.
3. Netscape was acquired by AOL in 1998. Netscape's most famous browser is the Navigator browser.
The emergence of LiveScript was originally to customize a language for Navigator browser, which does not support other browsers. When the Navigator browser was widely used, Microsoft was afraid, so Microsoft formed a team in the shortest time and began to develop a scripting language that only supports IE browser, called JScript.
In the era of coexistence of JavaScript and JScript, programmers are very painful because programmers have to write two sets of programs. In this case, a non-profit organization came forward, called ECMA Organization (European Computer Association). ECMA formulated ECMA-262 standard based on JavaScript, called ECMA script. Both modern JavaScript and JScript implement ECMA script specification. (JavaScript and JScript are unified)
2, How to embed JavaScript code in HTML?
The first way to embed JS code in HTML:
<!doctype html>
<html>
<head>
<title>HTML Embedded in JS The first way to code</title>
</head>
<body>
<!--
1,Functions to be realized:
The user clicks the following button to pop up a message box.
2,JS Is an event driven programming language, which relies on events to drive, and then executes the corresponding program.
stay JS There are many events in, one of which is called: mouse click, word: click. And any
Each event will correspond to an event handle called: onclick. [Note: the difference between event and event handle is:
An event handle is an event word preceded by an on. ]，The event handle is HTML The attribute of the tag does not exist
of
3,onclick="js code"，What is the principle of execution?
When the page opens, js The code will not execute, just put this paragraph JS Code registered to button click The incident happened.
Wait for this button to happen click After the event, register in onclick hinder js The code will be called automatically by the browser.
4,How do you use it? JS Code pop-up message box?
stay JS There is a built-in object called window，All lowercase, which can be used directly, window Represents a browser object.
window Object has a function called:alert，Usage: window.alert("news");So you can pop up the window.
5,JS Strings in can use double quotation marks or single quotation marks.
6,JS A semicolon can be used after the end of a statement in“;"，You don't have to.
-->
<input type="button" value="hello" onclick="window.alert('hello one')"/>
<input type="button" value="hello" onclick="window.alert('hello one')
window.alert('hello two')
window.alert('hello three')"/>
<!-- window. Can be omitted.-->
<input type="button" value="hello" onclick="alert('hello 1')
alert('hello 2')
alert('hello 3')"/>
</body>
</html>
The second way to embed JS code in HTML:
<!--
javascript Script blocks can appear multiple times in a page. No requirements.
javascript There is no requirement for the location of the script block, and it is optional.
-->
<script type="text/javascript">
// alert can block the loading of the current page. (block until the user clicks the OK button.)
window.alert("first.......");
</script>
<!doctype html>
<html>
<head>
<title>HTML Embedded in JS The second way of code</title>
<script type="text/javascript">
window.alert("head............");
</script>
</head>
<body>
<input type="button" value="I am a button object 1" />
<!--The second method: script block-->
<script type="text/javascript">
/*
The program exposed in the script block is executed when the page is opened, and it is executed line by line from top to bottom. (no event is required for the execution of this code)
*/
window.alert("Hello World!"); // The alert function blocks the loading of the entire HTML page.
// JS code comment, which is a single line comment.
/*
JS Multiline comments for the code. Just like java.
*/
window.alert("Hello JavaScript!");
</script>
<input type="button" value="I am a button object" />
</body>
</html>
<script type="text/javascript">
window.alert("last.......");
</script>
The third way to embed JS code in HTML: (introduce external independent JS files)
JS code:
//Remember to save the code here, otherwise there will be no prompt even if there is an exception when importing the html of this js file
window.alert("giao");
window.alert("giao");
window.alert("giao");
window.alert("final giao!");HTML code:
<!doctype html>
<html>
<head>
<title>HTML Embedded in JS The third way of code: introducing external independent js Documents.</title>
</head>
<body>
<!--
Introduce where needed js Script file
Introduce external independent js When you file, js The code in the file will be executed line by line from top to bottom.
<script type="text/javascript" src="js/1.js"></script>
Same js Files can be imported multiple times. However, there are few such requirements in actual development.
<script type="text/javascript" src="js/1.js"></script>
-->
<script type="text/javascript" src="js/1.js">
//The code written here will not be executed.
window.alert("Test");
</script>
<script type="text/javascript">
alert("hello jack!");
</script>
</body>
</html>