Question

我收到以下HTML表格：

<tbody>
   <tr role="row" class="odd">
   <td></td>
   <td><a id="link" href="detail.jsp">Nicolas COPERNIC</a></td>
   <td><a id="link" href="detail.jsp">dsdsdsds</a></td>
   <td></td>
   <td><a id="link" href="detail.jsp">2018-06-14 17:41</a></td>
   </tr>
   <tr class="unread even" role="row">
   <td></td>
   <td><a id="link" href="detail.jsp">Nicolas COPERNIC</a></td>
   <td><a id="link" href="detail.jsp">aa</a></td>
   <td></td>
   <td><a id="link" href="detail.jsp">2018-06-14 07:57</a></td></tr> 
</tbody>

这个表是由数据表创建的：

$('#datatable-table').DataTable({
                "bFilter": false,
                "bInfo": false ,
                "bPaginate": false,
                "bSort": false,
                "bAutoWidth" : true,

                ajax: 'Getdata?user='+Glogin,
                    columns: [
                        {   "data":"checkbox"
                        },
                        { "data": "two" },
                        { "data": "three" },
                        { "data": "four" },
                        { "data": "five" },
                        { "data": "six" }
                    ],
                    "aaSorting": [[ 5, "desc" ]],
                    createdRow: function (row, data, index) {
                        console.log("row"+row);
                        console.log("data 8: "+data["read"]);
                        if (data["read"] == "0") {
                            console.dir(row);
                            $(row).addClass("unread");
                        }
                }
            });

函数createdRow正在获取在我的表中创建的每一行，并且我想解析元素$（row）以在href元素上添加特定样式。如何解析行的元素并将此特定样式标记添加到我的href元素？

最后：

<a id="link" href="detail.jsp" style="color: red">Nicolas COPERNIC</a>

Answer 1

在表格中找到a并添加css，如下所示。

＆＃13;

$('table tr.unread').find('a').css({
  "color": "red"
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr role="row" class="odd">
      <td></td>
      <td><a id="link" href="detail.jsp">Nicolas COPERNIC</a></td>
      <td><a id="link" href="detail.jsp">dsdsdsds</a></td>
      <td></td>
      <td><a id="link" href="detail.jsp">2018-06-14 17:41</a></td>
    </tr>
    <tr class="unread even" role="row">
      <td></td>
      <td><a id="link" href="detail.jsp">Nicolas COPERNIC</a></td>
      <td><a id="link" href="detail.jsp">aa</a></td>
      <td></td>
      <td><a id="link" href="detail.jsp">2018-06-14 07:57</a></td>
    </tr>
  </tbody>
</table>

＆＃13;

替代方案是您可以使用attr。

＆＃13;

$('table tr.unread td').find('a').attr( "style", "color:red");

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr role="row" class="odd">
      <td></td>
      <td><a id="link" href="detail.jsp">Nicolas COPERNIC</a></td>
      <td><a id="link" href="detail.jsp">dsdsdsds</a></td>
      <td></td>
      <td><a id="link" href="detail.jsp">2018-06-14 17:41</a></td>
    </tr>
    <tr class="unread even" role="row">
      <td></td>
      <td><a id="link" href="detail.jsp">Nicolas COPERNIC</a></td>
      <td><a id="link" href="detail.jsp">aa</a></td>
      <td></td>
      <td><a id="link" href="detail.jsp">2018-06-14 07:57</a></td>
    </tr>
  </tbody>
</table>

＆＃13;

注意：您可以在DataTable绑定后执行此操作。

解析行元素并将样式添加到href元素

1 个答案: