JavaScript学习笔记（一）—

JavaScript学习笔记（一）——JS速览

第一章 JS速览

1 限制时间处理事件

 1 <script>
 2 
 3 setTomeout(wakeUpUser,5000);
 4 
 5 function wakeUpUser()
 6 
 7 {
 8 
 9 alert("Are you going to start at this boring page forever?");
10 
11 }
12 
13 </script>

2 变量 var 可以声明数值字符布尔类型，可以声明加赋值，也可以只声明。

变量命名规则：*以字母、下划线、美元符号打头；*字母数字下划线美元

*避免关键字

3 语法规则：

*每条语句分号结尾；

*单行注释 //

*空白无关紧要

*字符串可以单引号也可以双引号穿起来

*不用括号括起 true和false

*声明变量可以不给他指定值

*区分大小写

4 表达式：表达式的结果都为某种值（数字字符串布尔）

*var total=price-(price*(discount/100));

*"dear"+"reader"+""+name(变量)

*phonenum.substring(0,3);//

5 与用户交流

创建提箱框：alert("提醒文本");

直接写入文档：document.write();

控制台：console.log();

【控制台主要作用是写入日志，不在网页最终版本中使用，仅在开发网页期间调试代码

1 <script>
2 
3 var message="Howdy"+" "+"partber";
4 
5 console.log(message);
6 
7 </script>

】

直接操作文档:文档对象模型；

6 Javascript代码的放置位置：<head>(在加载整个网页内容前加载script代码)

<body>当然也可以在这两个部位使用外部<script src="xx.js"></script>

外部文件中直接放js代码，不需要<script>

!不能在引入外部文件的同时嵌入内部的js代码

7 开发一款战舰游戏

认识函数：var m=prompt("提示字符");//prompt函数返回输入的字符串

Math.random();//生成随机数0-1,如果生成0-100则*101

Math.floor();//将数字四舍五入

源：

  1 <!doctype html>
  2 
  3 <html lang="en">
  4 
  5 <head>
  6 
  7 <title>Battleship</title>
  8 
  9 <meta charset="utf-8">
 10 
 11 </head>
 12 
 13 <body>
 14 
 15 <h1>Play battleship!<h1>
 16 
 17 <script language="JavaScript" type="text/JavaScript">
 18 
 19 var location1,location2,location3;
 20 
 21 var guess;
 22 
 23 var hits1=0,hits2=0,hits3=0;
 24 
 25 var guesses=0;
 26 
 27 var isSunk=false;
 28 
 29 while(!isSunk)
 30 
 31 {
 32 
 33 //生成新的随机战舰位置
 34 
 35 location1=Math.floor(Math.random()*7);
 36 
 37 location2=Math.floor(Math.random()*7);
 38 
 39 while(location2==location1)
 40 
 41 location2=Math.floor(Math.random()*7);
 42 
 43 location3=Math.floor(Math.random()*7);
 44 
 45 while(location3==location1||location3==location2)
 46 
 47 location3=Math.floor(Math.random()*7);
 48 
 49 //获取用户输入
 50 
 51 guess=prompt("Ready,aim,fire!(enter a number 0-6):");
 52 
 53 if(guess>6||guess<0)
 54 
 55 {
 56 
 57 alert("Please enter a valid cell number！");
 58 
 59 }else
 60 
 61 {
 62 
 63 guesses=guesses+1;
 64 
 65 if(guess==location1)
 66 
 67 {
 68 
 69 alert("HIT 1!");
 70 
 71 if(hits1==3)
 72 
 73 {
 74 
 75 alert("You sank my battleship 1!");
 76 
 77 }
 78 
 79 else
 80 
 81 hits1=hits1+1;
 82 
 83 }
 84 
 85 else if(guess==location2)
 86 
 87 {
 88 
 89 alert("HIT 2!");
 90 
 91 if(hits2==3)
 92 
 93 {
 94 
 95 alert("You sank my battleship 2!");
 96 
 97 }
 98 
 99 else
100 
101 hits2=hits2+1;
102 
103 }
104 
105 else if(guess==location3)
106 
107 {
108 
109 alert("HIT 3!");
110 
111 if(hits3==3)
112 
113 {
114 
115 alert("You sank my battleship 3!");
116 
117 }
118 
119 else
120 
121 hits3=hits3+1;
122 
123 }
124 
125 else
126 
127 alert("MISS!");
128 
129  
130 
131 if(hits1==3&&hits2==3&&hits3==3)
132 
133 {
134 
135 isSunk=true;
136 
137 alert("You sank all my battleship!");
138 
139 }
140 
141 }
142 
143 }
144 
145 var states="You took "+guesses+" guesses to sink the battleship, "+"which means your shooting accuracy was "+(3/guesses);
146 
147 alert(states);
148 
149 </script>
150 
151 </body>
152 
153 </html>