JS DOM

元素获得

原始方式
1. var x = document.documentElement;
2. var x = document.body;
3. var x = document.getElementById(“aBC”)
4. var x = document.getElementByTagName(“p”)

选择器
1. document.querySelector("div p.red")
2. document.querySelectorAll("div p.red")

遍历DOM树
.parentNode  . children   .firstChild   .lastChild 
.nextElementSibling  .priviousElementSibing

元素创建与删除

1. document.createElement(新)
2. .appendChild(新) .insertBefore(新,item) .replaceChild(新,旧)  .removeChild(旧)  元素.cloneNode()
3. document.createTextNode()
4. document.getElementById('myAnchor').innerHTML="RUNOOB";
5. 父.removeChild(子)

属性获得

元素.attributes   
使用 for(var i=0;i<elem.attributes.length;i++){
  xxx = elem.attributes[i];
}

属性创建与修改

1. .getAttribute(“属性”)  
2. .removeAttribute(“属性名”)  //删除属性及属性值。
3. .setAttribute(“属性名”,”属性值”)  属性不存在,创建;若存在,替换属性值。
4. .style.属性=新样式
    document.getElementById("p2").style.color="blue";

添加事件

1. document.getElementById("myBtn").onclick=function(){myFunction ()};
2. document.getElementById("myBtn").addEventListener("click", myFunction);
注:addEventListener(event, function, useCapture);
useCapture :false冒泡(默认), true捕获
3. element.removeEventListener("mousemove", myFunction);
posted @ 2022-02-23 23:02  波吉国王  阅读(23)  评论(0编辑  收藏  举报