目录
1. 变量声明
变量声明有三个 var let 和const
我们应该用那个呢
首先var 先排除，老派写法，问题很多，可以淘汰掉....
let or const
建议：const 优先，尽量使用const，原因：
- const语义化更好
- 很多变量我们声明的时候就知道他会不被更改了，就使用const
- 实际开发中也是，比如react框架，基本const
如果你还纠结，那么我们建议：
有了变量先给const，如果发现它后面是要被修改的，再改为let
数组元素使用const，存储的是地址（存在栈中），可以增加元素（元素存在堆中），原数组不变，地址不变，数组可以增加删除属性。
以后数组和对象使用const来声明
2.DOM和BOM
2.1 作用和分类
作用：就是使用js去操作html和浏览器
分类：DOM（文档对象模型），BOM（浏览器对象模型）
1.2 什么是DOM
DOM（Document Object Model------文档对象模型）是用来呈现以及与任意HTML或XML文档交互的API
白话文：DOM是浏览器提供的一套专门用来操作网页内容的功能
DOM作用
开发网页内容特效和实现用户交互
1.3 DOM树
DOM数是什么
- 将html文档以树状结构直观的表现出来，我们称之为文档树或DOM树
- 描述网页内容关系的名词
- 作用:文档树直观的体现了标签与标签之间的关系
1.4 DOM对象（重点）
- DOM对象：浏览器根据html标签生成js对象
所以标签属性都可以在对象上找到
修改这个对象的属性会自动映射到标签上
- DOM的核心思想
把网页内容当做对象来处理
- document对象
是DOM里提供的一个对象
所以它提供的属性和方法都是用来访问和操作网页内容的
例如：document.write（）
网页所以内容都在document里面
1.5 获取DOM对象
1.5.1 根据css选择器来获取DOM元素（重点）
1.选择匹配的第一个元素
document.querySelector('css选择器')
参数：
包含一个或多个有效的css选择器字符串
返回值：
css选择器匹配的第一个元素，一个HTMLElement对象
2 选择匹配的多个元素
语法：
document.querySelectorAll（‘css选择器’）
参数
包含一个或多个有效的css选择器 字符串
返回值：
css选择器匹配的NodeList对象集合
获取的单个对象可以直接修改样式，多个对象集合的数组不能直接修改
SelectorAll获取 得到的是一个伪数组
有长度有索引号的数组
但是没有pop（） push（）等数组方法
想要得到里面的每个对象，则需要遍历（for）方式获得
1.5.2 其他获取DOM元素方法（了解）
//根据id获取一个元素
document。getElementById（‘nav’）
//根据标签获取一类元素
document.getElementsByTagName（‘div’）
//根据类名获取元素 获取页面所以类名为w的
document.getElementsByClassName（‘w’）
1.5.3 操作元素（重点）
1.元素 innerText属性
将文本内容添加/更新到任意标签位置
纯文本，不解析标签
2.元素innerHTML属性
将文本内容添加/更新到任意标签位置
会解析标签，多标签建议使用模板字符
3.常用属性
还可以通过js设置/修改标签元素属性，比如通过src更换 图片
最常见的属性比如：href ，title ， src 等
语法：
对象.属性 = 值
3.操作元素样式属性
1.还可以通过js设置/修改标签元素的样式属性
比如通过 轮播图小圆点自动更换颜色样式
点击按钮可以滚动图片，这是移动的图片的位置 left等等
学习路径
- 通过style 属性操作css
- 操作类名（clssName）操作CSS
- 通过classList操作类控制CSS
标签选择body，因为body是唯一的标签，可以直接写document.body.style
2.操作类名（className）操作css
如果修改的样式比较多，直接通过style属性修改比较繁琐，我们可以通过借助css类名的形式
语法：
元素.className = ' css类名'
注意：
1.由于class是关键字，所以使用className去代替
2.className是使用新值换旧值，如果需要添加一个类，需要保留之前的类名
3.通过classList操作类控制CSS（重点）
为了解决className容易覆盖以前的类名，我们可以通过classList方式追加和删除类名
语法：
//追加一个类
元素.classList.add('类名')
//删除一个类
元素.classList.remove('类名')
//切换一个类
元素.classList.toggle('类名')
toggle切换类，有就删掉，没有就增添
生成的是行内样式表，权重较高
4. 操作表单元素 属性
获取：DOM对象.属性名
设置：DOM对象.属性名 = 新值
使用innerHTML 属性不能得到表单内容
表单.value = '用户名'
表单.type = 'password'
表单属性中添加就有效果，移除就没有效果，一律使用布尔值表示 如果true代表添加了该元素 如果false代表移除了该元素
比如：disabled（按钮是否能点） checked（是否选中） selectd（下拉框？）
5. 自定义属性
标准属性：标签天生自带的属性 比如class id title等，可以直接使用点语法操作 比如：disabled ， checked ，selected ，
自定义属性：
- 在html5中推出来了专门的data-自定义属性
- 在标签上一律以data-开头
- 在DOM对象上一律以dataset对象方式获取
6. 定时器-间歇函数
定时器函数可以开启和关闭定时器
1.开启定时器
setInterval（函数，间隔时间）
作用：每隔一段时间调用这个函数
间隔时间单位是毫秒
注意函数名字不需要加括号
定时器返回的是一个id数字
2.关闭定时器
let 变量名 = setInterval（函数，间隔时间）
clearInterval（变量名）
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
