2024年3月13日发(作者：)

element 获取

Element是指HTML文档中的一个元素节点，包含了在文档中定

义的所有标签和属性。在前端开发中，我们经常需要通过JavaScript

操作DOM元素以实现交互效果或动态渲染页面。而获取DOM元素的方

法，就是通过选择器或DOM API来获取Element。

1. 选择器获取Element

选择器是一种用于获取DOM元素的语法规则，常见的选择器包括：

id选择器、class选择器、标签选择器、属性选择器等。

1.1 id选择器

通过元素的id属性值来选取元素，语法格式为：#id。

例如，获取id为“demo”的元素：

```

var element = elector('#demo');

```

1.2 class选择器

通过元素的class属性值来选取元素，语法格式为：.class。

例如，获取class为“demo”的元素：

```

var element = elector('.demo');

```

1.3 标签选择器

通过元素的标签名来选取元素，语法格式为：标签名。

- 1 -

例如，获取所有p元素：

```

var elements = electorAll('p');

```

1.4 属性选择器

通过元素的属性值来选取元素，语法格式为：[属性名=属性值]。

例如，获取所有href属性值以“”开头的链接：

```

var links =

electorAll('a[href^='']');

```

2. DOM API获取Element

除了选择器，还可以通过DOM API获取Element。常用的DOM API

包括：getElementById、getElementsByClassName、

getElementsByTagName、getAttribute等。

例如，获取id为“demo”的元素：

```

var element = mentById('demo');

```

不同于querySelector，getElementById仅仅返回一个元素，而

不是元素集合。

无论通过选择器还是DOM API获取Element，最终都将返回一个

- 2 -

Element对象，我们可以对该对象进行各种DOM操作。

- 3 -