html_javascript 基础操作

 1 <!DOCTYPE html>
 2 <html>
 3 <body>
 4 <h1>My Web Page</h1>
 5 <p id="demo">A Paragraph.</p>
 6 <button type="button" onclick="myFunction()">点击这里</button>
 7 <p><b>注释：</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p>
 8 <script type="text/javascript" src="/js/myScript.js"></script>
 9 </body>
10 </html>

空格

JavaScript 会忽略多余的空格。您可以向脚本添加空格，来提高其可读性。下面的两行代码是等效的：

var name="Hello";
var name = "Hello";

对代码行进行折行

您可以在文本字符串中使用反斜杠对代码行进行换行。下面的例子会正确地显示：

document.write("Hello 
World!");

不过，您不能像这样折行：

document.write 
("Hello World!");

重新声明 JavaScript 变量

如果重新声明 JavaScript 变量，该变量的值不会丢失：

在以下两条语句执行后，变量 carname 的值依然是 "Volvo"：

var carname="Volvo";
var carname;

JavaScript 数组

下面的代码创建名为 cars 的数组：

var cars=new Array();
cars[0]="Audi";
cars[1]="BMW";
cars[2]="Volvo";

或者 (condensed array):

var cars=new Array("Audi","BMW","Volvo");

或者 (literal array):

JavaScript 对象

对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔：

var person={firstname:"Bill", lastname:"Gates", id:5566};

上面例子中的对象 (person) 有三个属性：firstname、lastname 以及 id。

空格和折行无关紧要。声明可横跨多行：

var person={
firstname : "Bill",
lastname  : "Gates",
id        :  5566
};

对象属性有两种寻址方式：

实例

name=person.lastname;
name=person["lastname"];

Undefined 和 Null

Undefined 这个值表示变量不含有值。

可以通过将变量的值设置为 null 来清空变量。

实例

cars=null;
person=null;

Throw 语句

throw 语句允许我们创建自定义错误。

正确的技术术语是：创建或抛出异常（exception）。

如果把 throw 与 try 和 catch 一起使用，那么您能够控制程序流，并生成自定义的错误消息。

语法

throw exception

异常可以是 JavaScript 字符串、数字、逻辑值或对象。

 1 <!DOCTYPE html>
 2 <html>
 3 <body>
 4 
 5 <script>
 6 function myFunction()
 7 {
 8 try
 9 { 
10 var x=document.getElementById("demo").value;
11 if(x=="")    throw "值为空";
12 if(isNaN(x)) throw "不是数字";
13 if(x>10)     throw "太大";
14 if(x<5)      throw "太小";
15 }
16 catch(err)
17 {
18 var y=document.getElementById("mess");
19 y.innerHTML="错误：" + err + "。";
20 }
21 }
22 </script>
23 
24 <h1>我的第一个 JavaScript 程序</h1>
25 <p>请输入 5 到 10 之间的数字：</p>
26 <input id="demo" type="text">
27 <button type="button" onclick="myFunction()">测试输入值</button>
28 <p id="mess"></p>
29 
30 </body>
31 </html>