四、JavaScript 语句
1.JavaScript 语句向浏览器发出的命令。语句的作用是告诉浏览器该做什么。
2.分号 ;
分号用于分隔 JavaScript 语句。
通常我们在每条可执行的语句结尾添加分号。
使用分号的另一用处是在一行中编写多条语句。
提示:您也可能看到不带分号的案例。
在 JavaScript 中,用分号来结束语句是可选的。
3.JavaScript 对大小写是敏感的
4.空格
JavaScript 会忽略多余的空格。您可以向脚本添加空格,来提高其可读性。下面的两行代码是等效的:
var name="Hello";
var name = "Hello";
4.对代码进行折行
document.write("Hello <br> World!");
注意:
JavaScript 是脚本语言。浏览器会在读取代码时,逐行地执行脚本代码。
而对于传统编程来说,会在执行前对所有代码进行编译。
5.java注释
/**/
和
//
五、JavaScript 变量
1.重新声明 JavaScript 变量
如果重新声明 JavaScript 变量,该变量的值不会丢失:
在以下两条语句执行后,变量 carname 的值依然是 "Volvo":
var carname="Volvo";
var carname;
代码案例:
<html>
<head></head>
<body>
<script type="text/javascript">
var comment = "waxun";
var comment;
document.write(comment);
</script>
</body>
</html>
页面展示:
waxun
JavaScript 数据类型
字符串、数字、布尔、数组、对象、Null、Undefined
1.JavaScript 拥有动态类型
这意味着相同的变量可用作不同的类型:
var x // x 为 undefined
v
var x = 6; // x 为数字
v
var x = "Bill"; // x 为字符串
1.1JavaScript 数字
var x1=34.00; //使用小数点来写
v
var x2=34; //不使用小数点来写
JavaScript 只有一种数字类型。数字可以带小数点,也可以不带:
1.2JavaScript 布尔
布尔常用在条件测试中。
1.3JavaScript 数组
代码案例:
<html>
<head>
<title>js数组</title>
</head>
<body>
<script>
var i;
var ast = new Array();
ast = ["waxun","kaguo","yuzhou"];
for(i=0 ;i<ast.length;i++) {
document.write(ast[i]+"<br>");
}
</script>
</body>
</html>
运行结果:
waxun
kaguo
yuzhou
1.4JavaScript 对象
对象由花括号分隔。
在括号内部,对象的属性以名称和值对的形式 (name : value) 来定义。
属性由逗号分隔:
<html>
<head>
<title>js数组</title>
</head>
<body>
<script>
//对象的属性以名称和值对的形式(name : value) 来定义
var person={
firstname:"waxun",
lastname:"kaguo",
id:22
};
name1 = person.firstname;
name2 = person["lastname"];
document.write(name1+"<br>");
document.write(name2);
</script>
</body>
</html>
运行结果:
waxun
kaguo
1.5Undefined 和 Null
Undefined 这个值表示变量不含有值。
可以通过将变量的值设置为 null 来清空变量。
<html>
<body>
<script>
var person;
var car="Volvo";
document.write(person + "<br />");
document.write(car + "<br />");
var car=null
document.write(car + "<br />");
</script>
</body>
</html>
运行结果:
undefined
Volvo
null
1.6声明变量类型
当您声明新变量时,可以使用关键词 "new" 来声明其类型:
var carname=new String;
var x= new Number;
var y= new Boolean;
var cars= new Array;
var person= new Object;
JavaScript 变量均为对象。当您声明一个变量时,就创建了一个新的对象。
六、JavaScript 对象
1.JavaScript 中的对象
在 JavaScript 中,对象是数据(变量),拥有属性和方法。
当您像这样声明一个 JavaScript 变量时:
2.Throw 语句
<!DOCTYPE html>
<html>
<body>
<script>
function myFunction()
{
try
{
var x=document.getElementById("demo").value;
if(x=="") throw "值为空";
if(isNaN(x)) throw "不是数字";
if(x>10) throw "太大";
if(x<5) throw "太小";
}
catch(err)
{
var y=document.getElementById("mess");
y.innerHTML="错误:" + err + "。";
}
}
</script>
<h1>我的第一个 JavaScript 程序</h1>
<p>请输入 5 到 10 之间的数字:</p>
<input id="demo" type="text">
<button type="button" οnclick="myFunction()">测试输入值</button>
<p id="mess"></p>
</body>
</html>
3.JavaScript 表单验证
JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证
七、JavaScript 表单验证
JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。
被 JavaScript 验证的这些典型的表单数据有:
用户是否已填写表单中的必填项目?
用户输入的邮件地址是否合法?
用户是否已输入合法的日期?
用户是否在数据域 (numeric field) 中输入了文本?
八、JavaScript HTML DOM 事件
onmouseover 和 onmouseout 事件可用于在用户的鼠标移至 HTML 元素上方或移出元素时触发函数。
代码案例:
<!DOCTYPE html>
<html>
<body>
<div οnmοuseοver="mOver(this)" οnmοuseοut="mOut(this)" style="background-color:green;width:120px;height:20px;padding:40px;color:#ffffff;">把鼠标移到上面</div>
<script>
function mOver(obj)
{
obj.innerHTML="谢谢"
}
function mOut(obj)
{
obj.innerHTML="把鼠标移到上面"
}
</script>
</body>
</html>