Dom获取元素的多种方法

·  阅读 204

1.根据标签名进行获取

 let ulEle = document.getElementsByTagName("ul")[0];
 console.log(ulEle);
复制代码

2.通过name的属性值获取元素

 let inputEle = document.getElementsByName("f70")[0];
 console.log(inputEle);
复制代码

3.通过ID值获取元素

 let liEle = document.getElementById("box");
 console.log(liEle);
复制代码

4.通过类名获取元素

 let leiName = document.getElementsByClassName("F70");
 console.log(leiName[2]);
复制代码

5.获取父元素

- 1、获取一个元素(子元素) -2、通过这个元素找其父元素

 let navEle = document.getElementsByTagName("nav")[0];
 console.log(navEle);
 //格式:子元素.parentNode
 let headerEle = navEle.parentNode;
 console.log(headerEle);
复制代码

6.获取子元素节点

//格式:父元素.children
let Eles1 = headerEle.children;
 console.log(Eles1);
复制代码

7.获取子节点(元素、文本、注释)

//格式:父元素.childNodes
 let Eles2 = headerEle.childNodes;
 console.log(Eles2);
复制代码

8.获取第一个子节点

 let FEles = headerEle.firstChild;
 console.log(FEles); 
复制代码

9.获取第一个子元素节点

FEles = headerEle.firstElementChild;
// console.log(FEles); 
复制代码

10.获取最后一个子节点

// let LEles = headerEle.lastChild;
// console.log(LEles); 
复制代码

11.获取最后一个子元素节点

LEles = headerEle.lastElementChild;
// console.log(LEles); 
复制代码
分类:
前端
标签:
分类:
前端
标签: