一、标签元素操作

#返回元素的标签名(大写)
element.tagName  

#返回 NodeList 中位于指定下标的节点。
nodelist.item()

#返回该节点的大写字母标签名
element.nodeName    

#返回该结点的节点类型，1表示元素节点  2表示属性节点 3表示文本节点
element.nodeType   

#返回该节点的value值，元素节点的该值为null
element.nodeValue  

#返回元素的子节点的nodeslist对象，nodelist类似于数组，
有length属性，可以使用方括号 [index] 访问指定索引的值
(也可以使用item(index)方法)。但nodelist并不是数组
element.childNodes  

================创建元素===============
#创建一个新元素
document.createElement('元素名称')  

#添加元素到指定位置（向元素添加新的子节点）
element.appendChild(nodeName)

#在指定的已有的子节点之前插入新节点
element.insertBefore(insertNode,appointedNode)  

=================删除元素===============
element.removeChild(childElement)

================修改元素（替换）=========
element.replaceChild(newNode,replaceNode)

================查找元素==============
#通过子元素查找父元素
element.parentNode

#查找同级元素的前一个或后一个元素(不包含文本和属性节点)
element.previousElementSibling
element.nextElementSibling

#查找某个元素内的第一个或最后一个子元素
element.firstElementChild
element.lastElementChild

#返回子元素的个数
element.childElementCount

二、获取元素的其他信息

#返回内容的可视高度/宽度（不包括边框，边距或滚动条）
element.clientHeight/clientWidth

#返回元素的高度/宽度/相对于父元素的左偏移/右偏移
(包括边框和填充,不包括边距)
element.offsetHeight/offsetWidth/offsetLeft/offsetTop

#返回整个元素的高度（包括带滚动条的隐蔽的地方）
/宽度/返回当前视图中的实际元素的左边缘和左边缘之间的距离/上边缘的距离
scrollLeft/scrollTop:在父元素身上，用于获取内部元素滚动后被隐藏的距离。
element.scrollHeight/scrollWidth/scrollLeft/scrollTop

三、事件

能够被js监听的操作称为“事件”。在这些操作行为上绑定的函数，驱动的任务。

1、js中的常用事件

1.1 -文档加载完成触发的事件（文档就绪）
    window.onload
案例：
//文档就绪，文档载入完成后触发该事件
window.onload = function() {
 let dvObj = document.getElementsByTagName("div")[0];
 alert(dvObj.innerText);
}

1.2 -单击事件，元素被左键单击时触发
    element.onclick

1.3 -双击事件
    element.ondblclick

1.4 -表单控件中的值修改后触发
    element.onchange

1.5 -输入框值发生变化时触发
    element.oninput

1.6 -获取焦点（获得光标）/失去焦点（失去光标）
    element.onfocus  元素获得焦点
    element.onblur  元素失去焦点

四、事件

能够被js监听的操作称为“事件”。在这些操作行为上绑定的函数，驱动的任务。

1、js中的常用事件

1.1 -文档加载完成触发的事件（文档就绪）
    window.onload
案例：
//文档就绪，文档载入完成后触发该事件
window.onload = function() {
 let dvObj = document.getElementsByTagName("div")[0];
 alert(dvObj.innerText);
}

1.2 -单击事件，元素被左键单击时触发
    element.onclick

1.3 -双击事件
    element.ondblclick

1.4 -表单控件中的值修改后触发
    element.onchange

1.5 -输入框值发生变化时触发
    element.oninput

1.6 -获取焦点（获得光标）/失去焦点（失去光标）
    element.onfocus  元素获得焦点
    element.onblur  元素失去焦点

1.7 -重置按钮被点击(表单重置触发)，绑定在表单上
    element.onreset  

1.8 -提交按钮被点击(表单提交触发)，绑定在表单上
    element.onsubmit

1.9 -键盘相关事件
    onkeydown  某个键盘的键被按下

    onkeypress  某个键盘的键被按下或按住

    onkeyup  某个键盘的键被松开

1.10 -鼠标相关事件
    onmousedown  某个鼠标按键被按下

    onmousemove  鼠标被移动

    onmouseout  鼠标从某元素移开

    onmouseover  鼠标被移到某元素之上

    onmouseup  某个鼠标按键被松开

1.11 -窗口或框架被调整尺寸触发
    element.onresize  

2、事件对象event

在触发事件时，会伴随产生一个事件对象。

2.1、默认事件

某个元素触发事件后伴随的默认行为。

#取消事件的默认动作
event.preventDefault();

2.2、事件冒泡

由于元素之间产生嵌套关系，导致内部元素触发的事件从内到外依次产生。

#取消事件冒泡，不再派发事件
event.stopPropagation();

2.3、事件委托

出现元素嵌套的情况下，对所有嵌套元素绑定事件，通常是通过循环绑定。事件
委托就是通过将事件绑定在父元素身上，当某个子元素触发事件时，由父元素的
绑定事件处理。即将子元素的事件委托给父元素。

#在父元素触发事件时，可以通过target定位具体的子元素
event.target

2.4、其他属性

#从鼠标左中右键按顺序chrome,ff,ie中event.which的值分别是1，2，3
event.which
案例：
    window.onmousedown = function(event) {
        console.log(event.which);
    }

#返回当事件被触发时鼠标指针相对于浏览器页面水平/垂直坐标
event.clientX/clientY

#返回事件发生时鼠标指针相对于屏幕的水平坐标/垂直坐标
event.screenX/screenY

#返回事件发生时鼠标指针相对于元素上的水平坐标/垂直坐标
event.offsetX/offsetY

#事件触发时，返回 Unicode 字符码（键盘码）
event.keyCode   //不区分大小写
event.key   //key的字符表示

#事件发生时，返回鼠标指针位置相对于父文档的 x 像素坐标/y 像素坐标
event.x/y

五、定时器

1、setInterval/clearInterval

# -方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。
(每隔多少毫秒执行一次)，返回定时id，可用于停止
let id = setInterval(function,毫秒数)

# -停止setInterval的定时任务
clearInterval(id)
=====================================================
案例：
//倒数： 10...0
let n = 10;
let invId = setInterval(()=>{
 //当n为0时，停止当前的定时任务
 if(n==0) {
  clearInterval(invId)
 }
 document.write(n--);
}, 1000);

2、setTimeout()/clearTimeout()

#方法用于在指定的毫秒数后调用函数或计算表达式。
(在多少毫秒之后执行一次)----延迟执行
setTimeout()

#方法可取消由 setTimeout() 方法设置的 timeout。
clearTimeout()

=====================================================
案例：5秒后在span标签内显示hello world
setTimeout(()=>{
 document.getElementsByTagName("span")[0].innerText = "hello world!!!";
},5000)