ECMAScript:JavaScript基础语法Web APIDOM文档对象模型 一套操作页面元素的方法BOM浏览器对象模型 一套操作浏览器元素的方法
- 文档
document：一个网页可以称为文档- 节点
node：网页中的所有内容都是节点（标签、文本、注释等）- 元素
element：网页中的标签（标签节点）
console.log：如果打印的是一个元素的时候，是以标签的形式进行展示的console.dir：如果打印的是一个元素的时候，是以对象的形式进行展示的
数组不仅有长度、索引、还有一些内置的push()、pop()、join()等方法
伪数组只有长度、索引 没有内置的push()、pop()、join()等方法
- 事件源： 触发事件的那个元素（比如：按钮、盒子）
- 事件名： 事件的名字（比如：点击、移入…）
- **事件处理程序：**触发事件之后要执行的代码（比如：一般就是一个函数）
注意点：
- 事件处理程序并不是立马执行，只有当事件被触发时，才会在会执行
on + 事件名称
addEventListener
区别:使用on注册事件,同一个元素只能注册一个同类型事件,否则会覆盖。
addEventListener可以注册同一事件多次,不会被覆盖。
区别：
- innerText属性：
- 只能获取文本——》如果有标签会忽略
- 只能设置文本——》当设置的是标签时，标签不能被解析，标签不能生效
- innerHTML属性：
- 可以获取文本和标签
- 可以设置文本和标签——》当设置的是标签，标签可以被解析，标签可以生效
就表示当前触发的元素（事件源）
- 在函数内写return false
- 使用事件对象 e.preventDefault()
- 将href属性设为 javascript:;
浅克隆：只克隆当前标签 里边的内容不会克隆
深克隆：不仅克隆当前标签 里边的内容也会克隆
事件的捕获阶段
当一个元素的事件被触发时，同类型事件将会在该元素中所有祖先元素
由外而内依次被触发这已过程被称为事件捕获（可以通过addEventListener的第三个参数设置为true，表示当前事件在捕获阶段触发 )（如果需要事件捕获则在监听事件中事件处理函数后加上true）
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-CRH4L1PH-1656583906979)(webAPIs.assets/image-20200929115205520.png)]
时间的目标阶段
触发自己的事件 (比如点击 输入等)
事件的冒泡阶段
当一个元素的事件被触发时，同类型事件将会在该元素中所有祖先元素
由内而外依次被触发这已过程被称为事件冒泡（事件默认就时事件冒泡过程）[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-2oUH7fw9-1656583906981)(webAPIs.assets\image-20200929113205826.png)]整体流程 先执行事件的捕获阶段 再执行事件冒泡阶段
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-U63aPhIL-1656583906981)(webAPIs.assets/image-20200929120323898.png)]
阻止冒泡和捕获 e.stopPropagation()
阻止默认行为 e.preventDefault() return false
注意：addEventListener注册的事件，在高浏览器版本中，return false将没有效果，必须要用事件对象
js是单线程执行的，页面加载时，会自上而下执行主线程上的同步任务，当主线程代码执行完毕时，才开始执行在任务队列中的异步任务。
- 同步：指的是js在运行是任务是一个一个来的，前一个任务结束，才会执行后边的任务
- 异步：通常指的是js中的注册事件、定时器、延时器、Ajax等 做第一件事情同时，还可以做其他事情。异步任务通常会添加到任务队列，达到其条件才会触发
- 同步任务由JS的主线程依次执行
- 异步任务委托给浏览器执行
- 浏览器会将已完成条件的异步任务代码，加入任务队列等待执行
- 一旦主线程中的同步任务执行完毕后，系统就会按顺序读取任务队列中的异步任务，让异步任务进入主线程，开始执行。
- 计时器(setiInterval())可以设置浏览器每隔多少秒执行一次，只要不停止计时器，可以一直执行下去
- 延时器(setTimeout())只可以执行一次，页面重新加载时才会重新触发延时器
- 表单校验中的校验规则功能
- 过滤敏感词的替换功能
- 字符串中提取我们想要的部分