Javascript 为类的每个实例将类添加到父div

我有一个名为container的包装器div，在这个container div中有一个名为mix的div的多个实例。在每个

mix

中都有一个名为

changeclass

的类，该类带有文本值。我需要将每个

changeclass

div的文本值作为一个类添加到其父mix div中

这是我的HTML

<div class="mix">
  <div class="classchange">
    <p>active</p>
    <div class="text"></div>
  </div>
</div>
  <div class="mix">
  <div class="classchange">
    <p>active2</p>
    <div class="text"></div>
  </div>
</div>
  <div class="mix">
  <div class="classchange">
    <p>active3</p>

  </div>
</div>
  <div class="mix">
  <div class="classchange">
    <p>active4</p>
    <div class="text"></div>
  </div>
</div>

---

但我不知道如何添加。每个函数使其工作

迭代

.mix

中的

.each

，在每个

类更改中选择文本，并在
上调用
addClass
。将该文本与
混合：


$（'.mix'）。每个（函数（）{
$（this）.addClass(
$（this.find（'p'）.text（）
);
});
log（document.body.innerHTML）

活跃的

活动2

活性3

活性4

迭代
.mix
中的每个
，选择每个
类更改中的文本，并在
上调用
添加类
。使用该文本混合
：


$（'.mix'）。每个（函数（）{
$（this）.addClass(
$（this.find（'p'）.text（）
);
});
log（document.body.innerHTML）

活跃的

活动2

活性3

活性4

那么，您想将新类添加到每个
.mix
元素，对吗

如果是这样，那么我们可以迭代每个
.classchange
元素，并从中添加新类。像这样：

$('.classchange').each(function() {
  $(this).parent('.mix').addClass($(this).text());
});

因此，您希望将新类添加到每个
.mix
元素，对吗

如果是这样，那么我们可以迭代每个
.classchange
元素，并从中添加新类。像这样：

$('.classchange').each(function() {
  $(this).parent('.mix').addClass($(this).text());
});

要更好地控制每个匹配元素的行为，请使用函数在目标元素上循环，并分别控制每个父元素的DOM操作


//遍历all.classchange div
$（'.classchange'）。每个（函数（）{
//选择最近的。混合div添加基于当前目标文本的新类
$（this）.closest（'.mix'）.addClass（$（this.text（））；
});
.active{
颜色：红色；
}
.active2{
颜色：粉红；
}
.active3{
颜色：紫色；
}
.active4{
颜色：蓝色；
}

活跃的

活动2

活性3

活性4

要更好地控制每个匹配元素的行为，请使用该函数在目标元素上循环，并控制每个父元素的DOM操作。
单独混合
：


//遍历all.classchange div
$（'.classchange'）。每个（函数（）{
//选择最近的。混合div添加基于当前目标文本的新类
$（this）.closest（'.mix'）.addClass（$（this.text（））；
});
.active{
颜色：红色；
}
.active2{
颜色：粉红；
}
.active3{
颜色：紫色；
}
.active4{
颜色：蓝色；
}

活跃的

活动2

活性3

活性4

好吧，因为所有的
类更改都在
mix
中，所以您可以
document.querySelectorAll（path）
它将返回一个
节点列表

然后，您可以将其转换为数组数据结构，并对其应用
map
或
forEach
操作，其中您可以处理每个
classChange
节点及其父节点

这就是我在ES6中要做的，对于JQuery我不太确定，但我会把它放在这里，以防它有任何帮助。
好吧，因为你所有的
类更改
都在
mix
中，你可以
document.queryselectoral（path）
它将返回一个
节点列表

然后，您可以将其转换为数组数据结构，并对其应用
map
或
forEach
操作，其中您可以处理每个
classChange
节点及其父节点

这就是我在ES6中要做的，对于JQuery我不太确定，但我会在这里告诉大家，以防它有帮助