Question

我需要使用jQuery在集合的每个元素上添加CSS属性。有什么建议？

var jsonCss = {
    "color": "#555555",
    "font-weight": "bold",
    "text-align": "left"
};

var $tdCollection = $("tr:first-child").find("td:nth-child(2)"); //A collection of <td> elements
$.each($tdCollection, function(k, v){
    v.css(jsonCss);
})

Answer 1

您不需要在此使用each()，只需将CSS设置应用于jQuery对象中的所有元素：

var cssObject = {
    "color": "#555555",
    "font-weight": "bold",
    "text-align": "left"
};

var $tdCollection = $("tr:first-child").find("td:nth-child(2)");
$tdCollecton.css(cssObject);

另请注意，您定义的包含CSS规则的对象与JSON完全无关 - 它是一个对象 - 因此我更改了它的名称。

Answer 2

您可以使用for...in

var jsonCss = {
  "color": "#555555",
  "font-weight": "bold",
  "text-align": "left"
};

var $tdCollection = $("tr:first-child").find("td:nth-child(2)");
for (var p in jsonCss) {
  $tdCollection.css(p, jsonCss[p]);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr><td>Lorem</td><td>Lorem</td></tr>
</table>

将css属性添加到对象的集合中

2 个答案: