12.14笔记

1.元素分类
 

元素属性：1、普通属性  2、style样式属性  3、offset属性

2普通属性	元素对象.属性名= 属性值
style样式属性	元素对象.style.属性名 = "属性值"
offset属性	对象.offsetWidth 对象.offsetHeight 对象.offsetTop 对象.offsetLeft

2.节点

（1）创建节点

1.创建一个x标签

let newLi = document.createElement("x")

2、添加内容

 newLi.innerHTML = `<a href="#">我是新添加的li</a>`

 console.log(newLi)

       

元素的追加   需要（父元素）

 let ul = document.querySelector("ul")

 ul.appendChild(newLi)

（2）查找节点

1.通过父亲获取子节点

         let f = document.querySelector(".father")

         console.log(f.children[2])

         console.log(f.childNodes)

2.通过儿子找到父节点

        let s = document.querySelector(".son")

        console.log(s.parentNode)

3.兄弟节点

        let son2 = document.querySelector(".son2")

        console.log(son2.previousElementSibling)

        console.log(son2.nextElementSibling)

3.insertBefore

对象.insertBefore(目标节点,参照节点) 

4.克隆节点

newf.cloneNode(true)

true/flase：是否复制子节点

5.删除节点

父节点.removeChild(父节点.children[1])

6. 事件监听

事件源.addEventListener("事件类型",处理函数,true|false)

事件源.on事件类型=处理函数