在html中引用javascript的方式：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
alert("hello!");
</script>
</head>
<body>
</body>
</html>
外部引用：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="1.js">
</script>
</head>
<body>
</body>
</html>
javascript的变量类型：
- 数值类型
- 字符串类型
- 对象类型
- 布尔类型
- 函数类型
javascript里特殊的值：
- undefined 未定义的值，所有js变量未赋于初始值的时候，默认值都是undefined
- null 空值
- NAN 不是数值类型
var a；
var a=2;
关系运算：
等于：== 简单的做字面值的比较
全等于：=== 除了做字面值的比较之外，还会比较两个变量的数据类型。
逻辑运算：
&& 且运算
|| 或运算
！ 取反
在Javascript中，所有的变量，都可以作为一个boolean类型的变量去使用
0，NULL，undefine，""（空串）默认是false。
&& 与运算
有两种情况：
第一种：当表达式全为真的时候，返回最后一个表达式的值。
第二种：当表达式中，有一个为假的时候，返回第一个为假的表达式的值。
|| 或运算
第一种：当表达式全为假时，返回最后一个表达式的值
第二种：只要有一个表达式为真，就会返回第一个为真的表达式。
数组：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
var map=[1,2,3,4];
var a=[];
alert(a[0]);
for(var i=0;i<map.length;i++){
alert(map[i]);
}
</script>
</head>
<body>
</body>
</html>
F12找console可以查看错误
函数：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
function max(a,b){
if(a>b){
return a;
}
else{
return b;
}
}
var min=function(a,b){
if(a>b){
return b;
}
else{
return a;
}
}
alert(max(12,6));
alert(min(12,6));
</script>
</head>
<body>
</body>
</html>
javascript中函数不能重载
函数有arguments，隐形参数
就是在function函数中不需要定义，但却可以直接用来获取所有参数的变量。
自定义对象：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
var obj=new Object();
obj.name="张三";
obj.age=18;
obj.fun=function(){
alert(this.name+":"+this.age);
}
obj.fun();
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
var obj={
name:"张三",
age:18,
fun:function(){
alert("张三十三");
return "哈哈";
}
};
alert(obj.name);
alert(obj.age);
obj.fun();
</script>
</head>
<body>
</body>
</html>
js中常用的事件：
onload 加载完成事件
onclick 单击事件
onblur 失去焦点事件
onchange 内容发生改变事件
onsubmit 表单提交事件
事件的注册分为静态注册和动态注册两种：
什么是事件的注册？
就是告诉浏览器，当事件响应后要执行哪些操作代码，叫事件注册或事件绑定。
静态注册事件：通过html标签的事件属性直接赋予事件响应后的代码，
动态注册事件：是指先通过js代码得到标签的dom对象，然后再通过dom对象.事件名=function(){}
onload举例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
function onloadTest(){
alert("onload静态注册");
}
</script>
</head>
<body onload="onloadTest()">
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
window.onload=function(){
alert("onload动态注册完成");
}
</script>
</head>
<body>
</body>
</html>
onclick举例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
function onclickTest(){
alert("onclick静态注册");
}
window.onload=function(){
var obj1=document.getElementById("b2");
obj1.onclick=function(){
alert("动态注册onclick");
}
}
</script>
</head>
<body>
<button onclick="onclickTest()">按钮1</button>
<button id="b2">按钮2</button>
</body>
</html>
注意，如果js放在前面，那么要等html渲染完后再获取元素，否则获取元素为空。
onblur举例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
function onblurTest(){
console.log("静态注册onblur");
}
window.onload=function(){
var onblurObj=document.getElementById("password");
onblurObj.onblur=function(){
console.log("动态注册onblur");
}
}
</script>
</head>
<body>
用户：<input type="text" onblur="onblurTest()"><br>
密码：<input type="text" id="password"><br>
</body>
</html>
onchange举例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
function onchangeFun(){
alert("原神中最喜欢的人物改变了");
}
window.onload=function(){
var onchangeObj=document.getElementById("onchangeID");
onchangeObj.onchange=function(){
alert("游戏中最喜欢的人物改变了")
}
}
</script>
</head>
<body>
<select onchange="onchangeFun()">
<option>原神中最喜欢的人物</option>
<option>雷泽</option>
<option>班尼特</option>
<option>行秋</option>
<option>砂糖</option>
</select>
<br>
<select id="onchangeID">
<option>游戏中最喜欢的人物</option>
<option>但丁</option>
<option>太阳骑士</option>
<option>洋葱骑士</option>
</select>
</body>
</html>