在 JS 中不使用 querySelector 根据用户输入设置元素样式

Question

假设网络中有 10 个按钮和一个输入标签，用户可以输入按钮的数量来更改颜色。我只知道我可以通过使用查询选择器来做到这一点，但我也想知道是否有另一种方法可以在不使用它的情况下做到这一点。任何建议将不胜感激:)

Answer 1

TL/DR 可行的方法是使用 class、name 或 id。由于一般流程是用户 select 的元素使用数字，而您将该输入数据用于 select 实际元素，因此必须有一些 select 或就位。

getElementsByClassName()

Url: https://www.w3schools.com/jsref/met_document_getelementsbyclassname.asp

假设您的元素具有 class 属性，您可以 select 使用 classes。例如。 select 元素 class “一”，你可以使用 document.getElementsByClassName("one")

getElementById()

Link: https://www.w3schools.com/jsref/met_document_getelementbyid.asp

假设您的元素有 id，您可以使用 document.getElementById("demo") 来获取具有 id="demo"

的元素

getElementsByName()

Url: https://www.w3schools.com/jsref/met_doc_getelementsbyname.asp

假设您的元素有一个名称属性，您可以使用 document.getElementsByName("hey") 来获取名称为 hey

的元素

getElementsByTagName()

Url: https://www.w3schools.com/jsref/met_document_getelementsbytagname.asp

您还可以将标签名称用于 select 元素。要 select 您将使用 document.getElementsByTagName("button")

的 10 个按钮