一、函数
1.定义函数
语法：
<script type="text/javascript">
function name() { // name函数名，括号内为参数(形参)
document.write('这是一个函数'); // 语句
}
</script>
调用方式：
在<head>中嵌套<script>标签，在<script></script>中定义一个名为name的函数。通过如下代码调用：
// 调用函数的语句也需要放置在<script>和</script>中。
<script type="text/javascript">name();</script>
定义函数有以下几个规则：
(1). 使用function关键字，function后是函数名，与c#语言不同，不必说明返回值的类型。
(2). 函数的命名规则与变量名的命名规则相同。
(3). 函数名后的()，可以包含若干参数，也可以选择不带任何参数。
(4). 最后是一对{}，包含具体实现特定功能的若干语句。
2.函数的参数
对于函数外部的语句而言，函数内部语句是不可见的，这时就需要一种沟通机制，参数就是它们沟通的桥梁。参数也是一种变量，但这种变量只能被函数体内的语句使用，并在函数被调用时赋值，通常它们被称为形式参数。
使用方法：
<script type="text/javascript">
// 创建函数
function getTotal(salary, bonus){
document.writeln("工资和奖金的总额是："+(salary+bonus)+"元");
}
</script>
<body>
<!--函数参数的演示效果-->
张三：<script type="text/javascript"> getTotal(4800,2300);</script>
李四：<script type="text/javascript"> getTotal(6400,3100);</script>
</body>
3.函数的返回值
函数的参数是外部语句对函数内部语句的信息传递，函数的返回值刚好相反，能够将一个结果返回给外部语句使用。
语法：
return 返回值;
var result = 函数(参数);
函数返回值的使用：
<script type="text/javascript">
// 创建有返回值的函数
function getArea(width,height){
var result=width*height;
return result;
}
</script>
<p>宽度是：3，高度是：4的长方形面积是：
<script type="text/javascript">
// 调用有返回值的函数
var area=getArea(3,4);
document.write(area);
</script>
</p>
4.变量的作用域
(1).全局变量：在函数体外部声明，可以在任何地方包括函数的内部使用。
(2).局部变量：在函数体内声明，只能在函数体内使用，随着函数的结束而消失。
5.系统函数
(1).parseInt函数
<script type="text/javascript">
// 将字符串转换为整数，仅接收一个参数
parseInt("150.1cats"); // 150
</script>
(2).parseFloat函数
<script type="text/javascript">
// 与parseInt函数类似，该函数返回一个浮点数
parseFloat("150.13cats"); // 150.13
</script>
(3).isNaN函数
<script type="text/javascript">
// 用于判断参数是否是NaN(不是数字)，如果是返回true，否则返回false
var flag = isNaN("string");
document.write(flag) // true
</script>
二、事件
1.onclick事件
onclick事件是JavaScript中最常用的事件，它用于接收鼠标对页面元素按下，并抬起的动作，又称为单击事件。
<script type="text/javascript">
function show() {
alert("onclick事件");
}
</script>
<body>
<!--点击按钮，弹出提示框-->
<input type="button" value="点击" onclick="show()"/>
</body>
2.onload事件
onload事件会在页面加载完成后立即发生。
<body onload="document.title='onload事件'">
<!--修改标题为onload事件-->
</body>
3.onblur事件
onblur事件是指光标或者焦点离开元素后触发的事件，常用来验证表单。
<script type="text/javascript">
// 判断密码长度是否在6位以上
function checkPwd() {
var pwd = document.getElementById("txtPwd").value;
if(pwd.length <= 6) {
alert("密码的长度必须在6位以上");
}
}
</script>
<body>
<p>
请输入密码：<input type="password" id="txtPwd" onblur="checkPwd()"/>
</p>
</body>
4.onchange事件
onchage事件通常指输入框的值发生了变化，或者改变下拉列表框的选项会触发onchange事件。
<script type="text/javascript">
function changeLink(obj) {
if(obj.value != "请选择") {
// 根据选择的网站，在新窗口打开相应的首页
window.open(obj.value);
}
}
</script>
友情链接
<select onchange="changeLink(this)">
<option value="请选择">请选择</option>
<option value="https://www.jianshu.com/">简书</option>
<option value="https://www.baidu.com/">百度网</option>
<option value="https://www.w3school.com.cn/html/index.asp">HTML教程</option>
</select>
5.onmouseover事件和onmouseout事件
onmouseover和onmouseout事件是指鼠标移入、移出页面元素时触发的事件。
<marquee direction="right" onmouseover="stop()" onmouseout="start()">
<!--鼠标移入时，图片停止滚动；移出时，图片继续滚动-->
<img src="tupian.jpg" width="150px" height="150px"/>
</marquee>
6.onmousemove事件
onmousemove事件是鼠标指针移动时发生的事件，以像素为单位，每移动1像素onmousemove()方法则触发一次。
<style type="text/css">
div {
width: 200px;
height: 200px;
background-color: #ccc;
}
</style>
<script type="text/javascript">
// 计数器
var count = 0;
function move() {
document.getElementById("sp").innerHTML = ++count;
}
</script>
<body>
移动了<span id="sp">0</span>像素
<div onmousemove="move();"></div>
</body>
