使用JavaScript实现元素属性的目标/样式
使用JavaScript实现元素属性的目标/样式
提问于 2022-07-25 12:21:02
我试图使用JavaScript更改下面div元素的样式，但是使用它的属性作为选择器而不是类：
<div class="radio-wrapper" data-option-method="Option-A">例如，我能够通过以下CSS实现所需的效果：
.radio-wrapper[data-option-method="Option-A"] { display: none; }但是当我在JS中尝试做同样的事情时，我没有任何运气：
document.getElementsByClassName(".radio-wrapper[data-option-method="Option-A"]").style.display = "none";我相信这是一个相当简单的，但我正在努力研究一个明确的答案，非常感谢任何建议！
回答 2
Stack Overflow用户
回答已采纳
发布于 2022-07-25 12:26:07
首先，您有一个明确的语法错误。毫无疑问，您的浏览器控制台正在向您指出这一点。请始终检查控制台是否有错误。
由于您的字符串包含双引号，所以对字符串本身使用单引号：
'.radio-wrapper[data-option-method="Option-A"]'除此之外，document.getElementsByClassName是这里使用的错误函数。您所拥有的不是类名，而是更复杂的选择器。document.querySelector可以在此基础上找到元素：
document.querySelector('.radio-wrapper[data-option-method="Option-A"]').style.display = "none";或者，如果有多个匹配元素，并且要针对所有元素，请使用querySelectorAll并对结果进行迭代：
let elements = document.querySelectorAll('.radio-wrapper[data-option-method="Option-A"]');
for (let el of elements) {
el.style.display = "none";
}Stack Overflow用户
发布于 2022-07-25 12:23:33
问题是那不是类名。(数据-选项-方法=“选项-A”是一个属性)尝试它：
document.querySelector('.radio-wrapper[data-option-method="Option-A"]')如果要选择multiple，请使用querySelectorAll，但要考虑返回数组。
也要注意字符串中的‘，’和‘，或者用a来转义它们，或者像我那样组合它们。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73109141
复制相关文章
相似问题
腾讯云开发者
