在深入浅出CSS后，就剩下三剑客的javascript了，JavaScript是基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式、声明式、函数式编程范式。
1_js数据类型
js为弱语言，没有数据类型的部分
var a = 1
var b = "你好"
console.log(a)
console.log(b)
//输出结果：
1
你好
// 数据类型分类
// 数值型(Number)
var num1 = 1
var num2 = 1.1
var num3 = -13
console.log(num1 + num2 + num3)
// 字符串型（String）只要是单引号或双引号包裹
var s1 = "今天是个阴天"
console.log(s1)
var s2 = "go go go！！！"
console.log(s2)
//布尔型
var t = true
console.log("我是布尔型" + t)
var f = false
console.log("我是布尔型" + f)
//undefined型(Undefined)：未定义，不存在
var u = undefined
//null型(null)：有，但为空
var n = null
//对象数据类型
var 刘备 = { name: "刘备", age: 18, Height: 180 }
console.log(刘备)
console.log(刘备.name)
console.log("刘备的年龄是" + 刘备.age + "身高为" + 刘备.Height)
//数组/列表:啥都可以放
var arr = [1, 2, 3, 4, 5, 6, 7, "我是字符串", { name: "张三", minName: "法外狂徒" }, [1,2,3]]
console.log("数组为" + arr)
console.log(arr[6])
console.log(arr[8].minName)
console.log(arr[9][2])//第九个元素：数组的下标为2的元素
var info = [
{id:1,created:"2023-8-4",message:"adsfsaf",user:"张三"}
]
强制类型转换
Number()
字符串 -> 数字
若是纯数字的字符串，则直接变字符串
若是字符串有非数字内容，NaN
如果字符串是一个空串或者全是空格，则转化为0
parseInt()专用于字符串，将一个字符串转化为整数
parseFloat()专用于字符串，但转化为浮点数
如果对非String类型使用上述两种方法，它会将其转化为String类型然后再操作
转化为Boolean
// 使用Boolean()函数
数字->布尔
除了0和NaN，其余都是true
字符串->布尔
除了空串，其他都是true
null和undefind都会转为false
对象也会转化为true
对象
Object类型也称一个对象，是JS引用数据类型，是一种复合值
将很多值聚合到一起，可以通过名字访问这些值，无序集合，每个属性都是一个键值对。
对象除了可以创建自我属性，还可以通过从一个名为原型的对象继承属性
除了字符串，数字，true,false,null和undefined之外，JS中值都是对象
定义对象的方法：
var person = new Object
person.name = "Xietom"
person.age = 20
var person2 = { name: "Penguin", age: 20 }
//删除属性
delete person2.age
console.log(person2)
//遍历对象
for (var i in person) {
var w = person[i] //把值赋给w,i为键
console.log(i+":"+w)
}
//修改对象
person.name = "汉昭烈帝"
函数
是有一连串的字查询（语句的集合）所组成的，可以背外部程序调用，
向函数传递参数以后，函数可以返回一定的值
// 创建函数
//法1:
function fun() {
console.log("111")
}
//法2:
var play = function(num1, num2) {
console.log("222")
return num1 + num2
}
//对象函数
var person = {
//属性
name:"法外狂徒",
age:18,
//方法
sing:function(){
console.log("I wanna sing")
},
dance:function(){
console.log("I wanna dance")
}
}
事件
<!--事件概述：HTML事件可以触发浏览器中的行为，比方说当用户点击某个html则启动某段代码-->
<!--鼠标事件：通过鼠标触发事件，类似用户的行为-->
<!--
onmouseout:当鼠标指针移出元素时运行的脚本
onmouseenter:当鼠标指针移至元素时
onmouseleave:当鼠标指针移出元素时
onmousewheel:当鼠标滚轮滚动时
onmouseleave:当鼠标滚动条时运行的脚本
-->
eg:
<button onclick="f1()">单击</button>
<button ondblclick="f2()">双击</button>
<button onmousedown="f2()">鼠标按下</button>
<button onmouseup="f2()">鼠标抬起</button>
<button onmouseover="f2()">鼠标悬浮</button>
<script>
function f1(){
alert("啊～～")
}
function f2(){
alert("aaa~")
}
<!--
通过键盘触发事件，类似用户行为
onkeydown：当按下按键时运行脚本
onkeyup：当松开按键时运行脚本
onkeypress：当按下并松开时。。。。
-->
eg:
window.onkeydown = function(event) {
console.log(event)
}
文档节点
DOM： Document Object model
节点（node），是构成我们网页的最基本的组成部分，网页中每个部分都可以称为节点*
比如html标签，属性，文本，注释，整个文档都是一个节点
常用节点分四类：
文档节点：整个HTML文档
Document代表的是整个HTML文档，网页中所有节点都是他的子节点
元素节点：HTML文档中HTML标签
html中各种标签都是元素节点（Elemen）
属性节点：元素的属性
Attribute表示的是标签中的一个属性，属性节点不是元素子节点，而是元素节点的一部分
可以通过元素节点来获取指定的属性节点
文本节点：HTML标签中文本内容
Text表示的是HTML标签以外的文本内容，任意非HTML文本都是文本节点
文本节点一般是作为元素节点的子节点存在的，获取文本节点时，一般要获取元素节点，在通过元素节点获取文本节点
