javascript - 访问嵌套元素

Question

我使用多个按钮和一个公共类。当用户单击任何按钮时，我想让具有另一个类的元素填充为红色。

所以基本上我想给里面.wrapper所有有.col类的东西上色。

这就是我到目前为止所拥有的。

var clickMe = document.querySelectorAll('.common');
for (var i = 0; i < clickMe.length; i++) {
  clickMe[i].addEventListener('click', function (event) {

    var x = document.querySelectorAll('#wrapper svg .col'); //this is where my issue starts.
    x.style.fill = "red";

  }, false);
}

寻找一个纯 JavaScript 解决方案。

标签： javascript

Answer 1

像下面这样的东西应该适合你：

var clickMe = document.querySelectorAll('.common');
for (var i = 0; i < clickMe.length; i++) {
  clickMe[i].addEventListener('click', function (event) {

    var x = document.querySelectorAll('#wrapper svg .col'); //this is where my issue starts.
    for(var j=0;j<x.length;j++){
      x[j].style.fill = "red";
    }


  }, false);
}