javascript - 使用 javascript 或 php 向动态创建的元素添加相同的类

Question

您好!

因此，对于在线商店中的每个类别，我都有一个包含每个子类别的页面和一个包含产品的表格。我有 this table每个子类别的产品顶部都有排序按钮。我想要的是将与按钮相同的颜色添加到表中的每一行(产品)。因此，如果产品来自展示子类别，则颜色应为绿色等。

这需要动态完成，因为我有更多这样的页面，是从数据库创建的。 Another page

要添加子类别颜色，我使用的是一个简单的

$class++

在 while 循环中。像这样创建的 css 类

.col1{
   color: #3e8f3e;
}
.col2{
   color: #e38d13;
}
.col3{
   color: #b92c28;
}
.col4{
   color: #DC4C46;
}
.col5{
   color: #672E3B;
}
.col6{
   color: #F3D6E4;
}
.col7{
   color: #C48F65;
}
.col8{
   color: #223A5E;
}
.col9{
   color: #898E8C;
}
.col10{
   color: #005960;
}
.col11{
   color: #9C9A40;
}
.col12{
   color: #4F84C4;
}

我使用子类别名称作为按钮的 ID。按钮代码:

<li>
    <a type="button" class="btn-filter" id="'.$row['subcat_pro'].'" href="#go" title="'.$row['subcat_pro'].'" data-target="'.$row['subcat_pro'].'">'.$row['subcat_pro'].'</a><hr class="btn'.$class++.'">
</li>';

<span> 的代码颜色应该在哪里:

<span id="sub'.$row['subcat_pro'] .'" class="pull-right">('. $row['subcat_pro'] .') (SKU: '. $row['sku'] .')</span>

我真的不知道能做什么。

在此先感谢您的帮助!

Answer 1

老实说，我会把那种颜色放在你的“类别”或“子类别”表中，比如，我会创建一个名为“颜色”的列，然后当你创建你的表时，你可以这样做:

<?php 
    $categories = $db ... // get your categories here using a query

    foreach($categories as $category) {
          <span name="category_{$category['id']}" style="color:{$category['color']}" ><span>
    }
?>

但是，如果您不喜欢 HTML 中的内联样式，就像我不喜欢的那样，您将必须将所有这些颜色定义为 CSS 文件中的类，然后，您将使用这些类构建该 html .

如果您想要第二个选项的示例(这是一项非常艰巨的工作)，请告诉我。