一、BOM对象
1，window对象
所有浏览器都支持window对象，从概念上讲：一个HTML文档对应一个window对象，从功能上讲：控制浏览器窗口的，从使用上讲：window对象不需要创建对象，直接使用即可
2，window对象方法
alert() 显示带有一段消息和一个确认按钮的警告框。confirm() 显示带有一段消息以及确认按钮和取消按钮的对话框。prompt() 显示可提示用户输入的对话框。open() 打开一个新的浏览器窗口或查找一个已命名的窗口。close() 关闭浏览器窗口。setInterval() 按照指定的周期（以毫秒计）来调用函数或计算表达式。clearInterval() 取消由 setInterval() 设置的 timeout。setTimeout() 在指定的毫秒数后调用函数或计算表达式。clearTimeout() 取消由 setTimeout() 方法设置的 timeout。scrollTo() 把内容滚动到指定的坐标。
3，方法的使用
3.1弹窗方法，警告窗alert、确认窗confirm、输入窗prompt
Title
3.2 setinterval：间隔指定的毫秒数不停的执行指定的代码、clearInterval：停止方法
Title
3.3 settimeout（）：在指定的毫秒数后执行代码，cleartimeout（）：停止
Title 欢迎光临
二、DOM对象
HTML document object model（文档对象模型）
1，DOM树，展示文档中各个对象的关系，用于导航
2，节点关系
3，节点查找方法
3.1 直接查找
document.getElementById(); #通过id查找，得到是一个准确标签document.getElementsByClassName(); #通过类查找，不管同一类有几个标签，得到都是由同一类标签组成的数组document.getElementsByTagName(); #通过标签名查找，不管同一种标签有几个，得到的都是由同一种标签组成的数组document.getElementsByName(); #通过name属性查找，返回的是同一name值的标签组成的数组 注意：涉及寻找元素，注意
3.2 导航查找
'''parentElement // 父节点标签元素children // 所有子标签firstElementChild // 第一个子标签元素lastElementChild // 最后一个子标签元素nextElementtSibling // 下一个兄弟标签元素previousElementSibling // 上一个兄弟标签元素''' 注意：是没法直接找到所有的兄弟标签
4，节点操作
创建节点var tag=document.createElement（标签名） var father=document.Element..... 添加节点追加一个子节点father.appendchild(tag) 在father标签里加一个tag标签在某个节点前面加一个节点var ele=document.getElement.....father.insertbefore(tag,ele) 在father标签里的ele节点前加上tag节点 删除节点 var ele=document.getElement..... father.removechild(ele) 删除father标签里的ele节点 替换节点 var ele=document.getElement..... father.replace(tag,ele) 把father标签里的ele节点换成tag新节点 注意：所有的添加、删除、替换节点都是基于父级标签来操作的。创建几个节点，就最多可以添加几个节点。比如创建一个节点，最多添加几个节点
Title 这是一个寂寞的天，下着有些伤心的雨
5，节点属性操作
5.1 文本操作：innerHTML，innerText
Title innerHTML拿到的是对应标签里包含的所有内容，包括标签，比如上面的例子拿到‘欢迎来电’ innerText拿到的只是内容，没有标签，比如上面的例子就只拿到‘欢迎来电’，而没有a标签
5.2 属性操作
Title 你好啊
5.3 class属性操作
Title 菜单一
- 111
- 111
- 111
菜单二
- 222
- 222
- 222
菜单三
- 333
- 333
- 333
5.4 改变css样式
Title 这是一个寂寞的天，下着有些伤心的雨
注意：对于中间用—连接的属性，在这里中间的—给去掉。比如font—size写成fontSize，后面的单词首字母大写
5.5 value操作
对于input，select，textarea标签来说，可以.value获取到value值
6，事件
6.1 事件分类
onclick 当用户点击某个对象时调用的事件句柄。ondblclick 当用户双击某个对象时调用的事件句柄。onfocus 元素获得焦点。 练习：输入框onblur 元素失去焦点。 应用场景：用于表单验证,用户离开某个输入框时,代表已经输入完了,我们可以对它进行验证.onchange 域的内容被改变。 应用场景：通常用于表单元素,当元素内容被改变时触发.（三级联动）onkeydown 某个键盘按键被按下。 应用场景: 当用户在最后一个输入框按下回车按键时,表单提交.onkeypress 某个键盘按键被按下并松开。onkeyup 某个键盘按键被松开。onload 一张页面或一幅图像完成加载。onmousedown 鼠标按钮被按下。onmousemove 鼠标被移动。onmouseout 鼠标从某元素移开。onmouseover 鼠标移到某元素之上。onmouseleave 鼠标从元素离开onselect 文本被选中。onsubmit 确认按钮被点击。
6.2 绑定事件方法
方法一：
点我呀
方法二：
试一试!
6.3 事件介绍
onload：给body元素加onload，意味着页面内容被加载完成然后做某事，应用场景：有些动作需要在页面加载完成后立即执行，就可以用这属性
Title hello p
onsubmit：当表单提交触发，该属性只能给form元素使用。在表单提交前验证用户输入是否正确，如果验证失败，在该方法中我们应该阻止表单的提交
Title
onselect：
onchange：
onkeydown：
7，实例
7.1 二级联动
Title
7.2 导航栏
Title 电脑 手机 家电 照相机
7.3三级联动
Title
7.4模态对话框
Title