Javascript 如何对数据id和输入类型使用querySelector

我想为两种输入类型设置类名，第一种是输入框，另一种是按钮。最初，两者都是隐藏的，单击一个按钮，我想显示它们。这里需要注意的是，显示了多个网格（每条记录一个网格），根据单击发生的位置，我将显示它们各自的输入框和按钮

现在，我使用下面的命令显示输入框：

this.template.querySelector(`[data-id="${targetId}"]`).className = "show";

我用特定于记录的值填充输入类型上的数据id属性，以区分单击发生的位置。 现在，如果我想隐藏按钮，我必须使用类似的语句，但我仍然需要使用数据id属性值。如何将数据id和type=“button”与querySelector一起使用？

这适用于“document.queryselectoral”，而不是“This.template.queryselectoral”

我假设输入字段总是以相同的顺序（输入，按钮）显示，并且它们都具有相同的“数据id”值。并且它对它们是唯一的（页面上只有两个对象具有此数据id值）

---

谢谢你的意见，我的错，我没有想到QuerySelector。下面简单使用：让inp=this.template.querySelectorAll（

[data id=“${targetId}]”

）；inp[0].className=“显示”；inp[1].className=“show”；是的，数据id对他们来说是唯一的。。现在它的工作原理与预期一致。

onclick='x=this.template.querySelectorAll(`[data-id="targetId"]`);x[0].type="text";x[1].type="button";'