JS
JS简介
js全称JavaScript，是一种嵌入在网页中的程序段。
js是一种解释型语言，被解释器（浏览器、手机APP等）解释执行。
js由Netscape发明，ECMA将其标准化。JavaScript借用了java的名字和java语法，但它和java没有关系。
js用于增强客户端的交互功能。
js事件
点击事件:
<input type="button" value="打什么不费力气？" onclick="answer()">
<span id="infoSpan"></span>
点击调用answer()函数，定义函数用function对象
function answer() {
//根据id，得到指定id对应的元素对象
var spanObj = document.getElementById("infoSpan");
//设置标签中间的文本
spanObj.innerHTML = "打瞌睡";
//设置标签文本的颜色
spanObj.style.color = "gray";
//设置标签背景色为黄色，如果样式中有‘-’，去掉‘-’采用驼峰命名
spanObj.style.backgroundColor = "yellow";
//设置大小，像素设置需要带单位
spanObj.style.fontSize = "16px";
}
下拉框事件:
<body id="bodyObj"><img src="img/5.jpg" width="200" height="300" id="faceImg"><br>
<!--onchange()：表示当下拉框选项变化时，触发的事件-->
<select id="faceSelect" onchange="faceChange(this)">
<option value="img/reying1.jpg">春香</option>
<option value="../img/reying2.jpg">夏香</option>
<option value="../img/reying3.jpg">秋香</option>
<option value="../img/reying4.jpg">冬香</option>
</select>
</body>
下拉框选项变化事件:
<script>
function faceChange() {
//得到下拉框对象
var selectObj = document.getElementById("faceSelect");
//弹出消息框，会阻塞
alert(selectObj.value);
//在控制台打印，不会阻塞
console.log("************");
}
function faceChange(selectObj) {
document.getElementById("faceImg").src = selectObj.value;
document.getElementById("bodyObj").style.backgroundImage = "url("+selectObj.value+")";
}
</script>
文档加载完毕事件:
由于js时解释性语言，解释器从上往下解释执行。那么，在执行元素获取时，有可能会在解释器没有读取到元素时获取对象。这时就会为null。
解决方案：
1、将js代码放在网页最后，等待解释器读取到所有元素，然后再获取对象。
2、创建文档加载完毕事件，等待解释器读取完所有元素，然后和再获取对象。
var divObj;
//文档加载完毕后触发
window.onload = function () {
divObj = document.getElementById(divId);
}
function showDiv() {
divObj.style.display = "block";
}
失去焦点事件：onblur
<input type="text" name="userName" id="userName" onblur="checkName()">
js基本语法:
js嵌入网页的方式
1、嵌入式：在<script>标签中书写js代码
<script>……</script>
2、外联式：将js代码独立成js文件，然后导入到网页中
<script src="1.js"></script>
注意：一旦<script>标签导入了js文件，不能再书写其他的js代码。如果需要再书写js代码，可以重新创建<script>标签。
3、在事件中添加js代码
<input type='button' onclick="……“>
4、超链接伪URL方式
<a href="javascript:alert('dd')">查看</a>
js变量和常量
js是一种弱类型语言，弱类型是指变量任何数据都可以存放。可以存放数字，可以存放字符串，也可以存放对象的引用。使用var声明一个变量。
正因为js是一种弱类型语言，所有，函数形参只能写形参名，不能写类型。
ES6标准中，新定义了let和const。let用于定义变量，功能和var类似。const用于定义常量，常量的值在运行期间无法变化。
js数据类型
js数据类型分为：原始数据类型和引用数据类型
原始数据类型
undefined
变量没有初始化，函数没有返回值
null
表示在变量中没有存放任何对象的引用。
null是从undefined中衍生过来的，null==undefined 结果为true。
boolean
代表条件是否满足，取值：true/false
在if条件判断中，表达式可以是任何数据类型，只有0、false、null、undefined结果才不满足。否则，结果都为true。
number
数字型：包含整数和小数。
alert (6/3+" "+6/4);结果为：2 1.5
NaN：表示非数字，它和自身不相等。一般发生在数字转换失败时。
string
字符串型：可以用单引和双引表示。在string中定义的方法和java类似。
在js中，数组和字符串的长度都是length属性
var s = "abc";
alert(s.length);
类型转换
自动类型转换
//结果为8.先将”10“转化为number，在和2相减
console.log("10" - 2);
//结果为"102".做+运算时,操作数有一个是字符串都做连接
console.log("10" + 2);
//结果为6.先将字符串转化为number,再相乘
console.log("2" * "3");
//结果为NaN.当做乘法时,会先将操作数自动转换为number,转化失败为NaN.
console.log("四" * "五");
console.log("五" * 5);
//结果为false.NaN和自身不相等
console.log(NaN == NaN);
//结果为true.先将"55"字符串转化为number,然后再比较
console.log(55 =="55");
//结果为false.===不但比较内容,而且会比较类型
console.log(55 === "55");
强制类型转换
parseInt("2")
将字符串转化为number类型。自动丢失第一个非数字之后的内容。如果第一个字符为非数字，结果为NaN.
parseFloat(”3.4“)
将字符串转化为number类型，允许转小数。
引用数据类型：在变量中，存放对象的引用。所有对象的父类都是Object。
js弹出框
alert(内容);
js控制台打印
console.log(内容);
js操作样式
元素对象.style.样式=”“；
改变class属性时，必须为className
divObj.className="body";
js跳转页面
location.href='2.html'；
正则表达式
[]：匹配[]中描述的任意字符
(com|cn|net):表示com、cn、net三个字符串任意出现一个。
{}
{3,}：表示至少出现3次，没有上限。
{3}：表示前一个规则只能出现3次，不能多不能少。
{3，10}：表示前一个规则，最少出现3次，最多出现10次。
汉字：\u4e00-\u9fa5
+：等价于{1,}，表示前一个规则至少一次，没有上限。
*：等价于{0,}，表示前一个规则可以不出现，也可以出现多次。
？：等价于{0,1}，表示前一个规则可以不出现，最多出现一次。
.：匹配任意字符
\d：匹配数字；\D：匹配非数字
\s：匹配空格、回车
\w：匹配字母、数字、下划线
js正则表达式
定义：var rexp = /^……$/；
if(rexp.test(”‘))：判断字符串是否匹配正则表达式。
