JavaScript-DOM关键单词、事件等

this当前事件所对应的元素，例如：onclick=fun（this）
innerHTML获取html内容，加粗变小都可以，
innerTEXT获取文本内容，不显示效果；
el.style.属性 = xxx设置元素的行内样式，例如：el.style.fontSize="16px";

event 事件 onclick 单击 onsubmit 提交事件 onblur失去焦点 onfocus获取焦点 onchange发生改变

getAttribute("src") 获取属性
setAttribute("alt"，"src") 设置属性
ondeType 节点类型 1元素节点 3文本节点
nodeName 节点名称
nodeValue 节点的值

clientHeight 内容高
clientWidth 内容宽
offsetHeight 内容+边框高度
offsetWidth 内容+边框宽度
scrollHeight 内容+滚动区域高
scrollWidth 内容+滚动区域宽
scrollTop 元素滚动顶部的距离
scrollLeft 元素滚动左右的距离
documentElement文档根节点
innerWidth浏览器可视宽
innerHeight浏览器可视高
getBoundingClientRect()获取到该元素的宽高距离信息
offsetTop 顶部偏移值
add添加
Event事件
Listener监听器
remove移除
addEventListener(事件名,事件处理函数)添加事件监听器
removeEventLister(事件名,事件处理函数)移除事件监听器
事件的参数event
target事件的目标
offsetX ，offsetY相对于当前事件对象的左上角

pageX，pageY相对于页面的左上角

clientX，clientY相对于浏览器可视区域

QQ图片20191231154817.jpg

点击时xy的不同情况值.png

el.getBoundingClientRect() 有4个值top距离浏览器可视区域顶部的距离、 left width height；获取到该元素的宽高距离信息；
el.offsetTop el.offsetLeft 距离已定位的父亲（body）元素距离；

stop停止
Propagation冒泡
prevent 阻止
contextmenu 右键菜单
mousewheel 鼠标滚动
dragstart 拖动开始
dragover 拖动在上面
drop 松开
dataTransfer 数据传送器
draggable="true" 代表允许被拖放
100vh是整个屏幕的高
100vw是整个屏幕的宽

【事件有2种触发类型：1.冒泡，2.捕获； 冒泡是指事件触发由最小元素先触发，然后再逐级向上，告诉父亲元素； 捕获：事件触发由最大的元素最先触发，然后逐级向下，告诉子元素； 默认false冒泡流，若改为true则为捕获流】