黑马程序员_JavaScript函数的基本使用
------- Windows Phone 7手机开发、.Net培训、期待与您交流！ -------
一、在HTML中使用JavaScript
1.在<body>……</body>之间，多个JavaScript分别用<script>包含
例1：一般直接在页面输出的内容放在<body>……</body>之间
<body>
<script type="text/javascript">
document.write("<h1>hello world!</h1>");
</script>
</body>
例2：也可把函数放到<body>……</body>之间
<body>
<div onclick="clickme()">click me</div>
<script type="text/javascript">
function clickme()
{
alert("you clicked me!");
}
</script>
</body>
例3：也可把外部js文件放在<body>……</body>之间
<body> <div onclick="clickme()">click me</div> <script type="text/javascript" src="example.js"></script> </body>
外部example.js文件：function clickme()
{
alert("you clicked me!");
}
2.在<head>……</head>之间，用法同上一样，只是如果把一般输出内容放在<head></head>貌似没有太多意义，把输出内容都放在body内容的前面了。
注意：对于这两种放的位置，貌似其中可能会影响页面加载速度。
（1）有书说对于很多JavaScript代码都放在<head>里的话意味着必须等全部JavaScript代码都被下载、解析和执行完成以后才能开始呈现页面的内容，这样呈现页面的时候会出现延迟，而延迟过程中浏览器窗口中将是一片空白，而放在<body>内容的最后面则可避免这种情况。
（2）也有书说把JavaScript代码放在<head>里可确保在需要使用脚本之前，它已经被载入，可加快页面的下载速度。
二、下面来看个常用的例子，函数的编写和调用，使用到正则表达式
<html>
<head>
<title>javascript函数的编写和调用</title>
<script type="text/javascript">
//对输入内容的验证函数
//参数：1.文本框ID，2.显示错误信息的label的ID，3.正则表达式，4.文本框空时提示的信息，5.不匹配正则表达式时提示的信息
function check(textID,errorID,regex,nullMessage,errorMessage) {
var textValue = document.getElementById(textID).value;
if (!textValue) {
//如果文本框为空
document.getElementById(errorID).innerHTML = nullMessage;
document.getElementById(errorID).style.color = "red";
document.getElementById(textID).focus();
}
else {
var reg = new RegExp(regex);
if (!reg.test(textValue)) {
//如果与正则表达式不匹配
document.getElementById(errorID).innerHTML = errorMessage;
document.getElementById(errorID).style.color = "red";
return;
}
//如果输入的内容正确，提示可以使用
document.getElementById(errorID).innerHTML = "可以使用";
document.getElementById(errorID).style.color = "blue";
}
}
</script>
<script type="text/javascript">
//对用户名的验证
function userNameCheck() {
check("nameId", "errorUserName", "^[a-zA-Z_][A-Za-z0-9_]*$", "用户名不能为空", "用户名必须是字母数字或下划线, 不能以数字开头");
}
</script>
<script type="text/javascript">
//对密码的验证
function pwCheck() {
check("PW", "errorPW", "^[A-Za-z0-9_]{6,16}$", "密码不能为空", "密码为6-16位字母、数字或者下划线");
}
</script>
</head>
<body>
<div><input type="text" id="nameId" value="" onblur="userNameCheck()"/><label id="errorUserName"></label></div>
<div><input type="password" id="PW" value="" onblur="pwCheck()"/><label id="errorPW"></label></div>
</body>
</html>
这个例子是对输入的用户名和密码使用javascript进行我们规定的规则进行验证，这个规则使用正则表达式来匹配。其中把验证的过程写成一个函数，具体验证时再进行调用。貌似里面用到了DOM的知识，但是由于还没学习到，不懂就直接网上找，才完成了这个小例子，供以后编写代码时参考。