JavaScript history
- HTML pages lack of interactivity
- Resulting in a waste of bandwidth, time and server resources
- Adding front-end basic checks: login name, if the password is blank, enter the password twice are the same ...
JavaScript code embedded in HTML
<script> ... </script>
- Execute code, dynamic and static content of the output code of HTML to integrate the browser when the page loads
- Before you can verify submitted to the remote server user input
JavaScript syntax
1, dynamic data integration
document.write: write HTML expressions or JavaScript code to the document flow
<html>
<head>
<title>JavaScript Page</title>
</head>
<body>
<script type="text/javascript">
document.write("<p>Hello world!</p>");
document.write("<p>输出 HTML 标签没压力" +"<i>hello world</i>?</p> ");
</script>
<p> 这是一些静态内容。 </p>
</body>
</html>
2, data types and expressions
type of data
- String
- Number
- Boolean
variable
- Variable names consist of letters, digits, and underscores
- Variable names are case sensitive
- Not need to declare the variable name is created (JavaScript does not check the type of a variable) when the variables for the first time
<html>
<head>
<title>Data Types and Variables</title>
</head>
<body>
<script type="text/javascript">
var x, y;
x= 1024;
y=x;
x = "foobar";
document.write("<p>x = " + y + "</p>");
document.write("<p>x = " + x + "</p>");
</script>
</body>
</html>
3, control statements
<! - continuously folded piece of paper, the thickness of the sheet before the floor reaches a distance from the sun, need to be folded many times? ->
<body>
<Script type = "text / JavaScript"> var distanceToSun 5280 * * = 12 is 93.3e6 ;
var Thickness = .002 ;
var foldCount = 0 ;
the while (Thickness < distanceToSun) {
Thickness * = 2 ;
foldCount ++ ;
}
document.write ( "off requires co <b>" + foldCount + " </ b> Ci." );
</ Script>
</ body>
4, string objects
<script> var txt = "Hello"; document.write(txt.length+"</br>"); // 属性 document.write(txt.replace('e','i')+"</br>")//封装函数 document.write(txt.search('l')); </script>
5, interactive pop
prompt(message, value)
- parameter:
- message dialog prompt message to be displayed
- value appears in the box defaults
- Returns: the value (type string) input by the user
- If the value is a number, using parseFloat (parselnt) conversion
<body>
<Script type = "text / JavaScript"> var the userName = prompt ( "Enter your name:", "Bob" );
var userAge = prompt ( "Please enter Age:", "20 is" );
var userAge = parseFloat (userAge);
IF (userAge <18 ) {
document.write ( "<h1> Internet moderate minors </ h1>!" );
} the else {
document.write ( "<h1> Welcome," + userName + "! </ h1 of>" );
} </ Script>
<P> of The REST of The Page ... </ P>
</ body>
6, Math Object
- Built-in Math object contains functions and constants
| Math.sqrt | Math.pow | Math.abs | Math.max | Math.min |
| Math.floor | Math.cell | Math.round | Math.PI | Math.E |
| Math.random (returns a real number of 0 to 1) | ||||
<body>
<div style="text-align:center">
<script type="text/javascript">
var roll1 = Math.floor(Math.random()*6) + 1;
var roll2 = Math.floor(Math.random()*6) + 1;
document.write("<img src='die" + roll1 + ".gif'/>");
document.write(" ");
document.write("<img src='die" + roll2 + ".gif'/>")
</script>
</div>
</body>
<!--Math.floor(Math.random()*6) 0-5-->
7, eval function: calculating a string, and executes the JavaScript code
<script> eval("x=10;y=20;document.write(x*y)"); document.write("<br>" + eval("2+2")); document.write("<br>" + eval(x+17)); </script>
A string passed to the interface. . . You need eval? ? ?