如何更改不同元素代码 css 中的元素 - TypeScript

概述

在 TypeScript 中，我们可以使用以下方法来更改 css 中的不同元素代码：

1. 通过 ID 更改元素代码。
2. 通过 class 更改元素代码。
3. 通过标签名更改元素代码。

通过 ID 更改元素代码

我们可以使用以下代码来通过 ID 更改元素代码：

const element = document.getElementById("myElement");
element.style.color = "red";

我们首先使用 getElementById 方法获取指定 ID 的元素，然后使用 style 对象来更改元素的样式。在这种情况下，我们将元素的颜色更改为红色。

通过 class 更改元素代码

我们可以使用以下代码来通过 class 更改元素代码：

const elements = document.getElementsByClassName("myClass") as HTMLCollectionOf<HTMLElement>;

for (let i = 0; i < elements.length; i++) {
  elements[i].style.color = "red";
}

我们首先使用 getElementsByClassName 方法获取指定 class 的元素，并将其存储在 HTMLCollection 中。然后，我们使用循环遍历集合中的每个元素，并使用 style 对象来更改其样式。在这种情况下，我们将元素的颜色更改为红色。

通过标签名更改元素代码

我们可以使用以下代码来通过标签名更改元素代码：

const elements = document.getElementsByTagName("p") as HTMLCollectionOf<HTMLElement>;

for (let i = 0; i < elements.length; i++) {
  elements[i].style.color = "red";
}

我们首先使用 getElementsByTagName 方法获取指定标签名的元素，并将其存储在 HTMLCollection 中。然后，我们使用循环遍历集合中的每个元素，并使用 style 对象来更改其样式。在这种情况下，我们将元素的颜色更改为红色。

结论

在 TypeScript 中，我们可以使用不同的方法来更改 css 中的元素代码。根据情况，我们可以选择使用 ID、class 或标签名来选择元素，并使用 style 对象来更改其样式。