Question

我正在使用一些jQuery来更改表中的单元格，由于某种原因我无法理解为什么它不起作用。我想因为jquery代码是如何不需要绑定的，我错了吗？

<script src="Scripts/jquery-1.10.2.min.js" type="text/javascript"></script>

<script type="text/javascript">
    var td = document.getElementsByTagName("td");
    var i = 0, tds = td.length;
    for (i; i < tds; i++) {
        if (td[i].innerText == 75) {
            td[i].setAttribute("style", "background:green;");
        }
    }

</script>

更新：这是我在aspx页面的头部：

<script type="text/javascript">
    var td = $("td");
    var i = 0, tds = td.length;
    for (i; i < tds; i++) {
        td[i].setAttribute("style", "background:green;");
         if (td[i].innerText == 75) {
            td[i].setAttribute("style", "background:green;");
        }
    } 

</script>
<script type="text/javascript" src="~/JavaScript1.js"></script>

<link rel="stylesheet" type="text/css" href="~/StyleSheet1.css" />
<title id="FttTitle" runat="server"></title>
</head>

以下是正在呈现的表：

 <div id="DataList1" style="color: white" align="center" runat="server">
        <asp:ListView ID="ListView1" runat="server" Style="color: white; font-weight: bold; font-size:18px;">
            <LayoutTemplate>
                <table id="ptbl" runat="server" cellpadding="2" border="1" style="color: white; font-weight: bold; font-size:18px;">
                    <tr runat="server">
                        <th runat="server">Team Name</th>
                        <th runat="server">Points</th>
                        <th runat="server">Wins</th>
                        <th runat="server">Loss</th>
                        <th runat="server">Ties</th>
                        <th runat="server">Win %</th>
                    </tr>
                    <tr runat="server" id="itemPlaceholder" />
                </table>
                <asp:DataPager runat="server" ID="ContactsDataPager" PageSize="90">
                    <Fields>
                        <asp:NextPreviousPagerField ShowFirstPageButton="true" ShowLastPageButton="true"
                            FirstPageText="|&lt;&lt; " LastPageText=" &gt;&gt;|"
                            NextPageText=" &gt; " PreviousPageText=" &lt; " />
                    </Fields>
                </asp:DataPager>
            </LayoutTemplate>
            <ItemTemplate>
                <tr runat="server">

                    <td>
                        <asp:Label ID="Label1" runat="server" Style="font-weight: bold"><%# Eval("Tm_Nm") %></asp:Label></td>
                    <td>
                        <asp:Label ID="Label2" runat="server" Style="font-weight: bold"><%# Eval("TP") %></asp:Label></td>
                    <td>
                        <asp:Label ID="Label3" runat="server" Style="font-weight: bold"><%# Eval("W") %></asp:Label></td>
                    <td>
                        <asp:Label ID="Label4" runat="server" Style="font-weight: bold"><%# Eval("L") %></asp:Label></td>
                    <td>
                        <asp:Label ID="Label5" runat="server" Style="font-weight: bold"><%# Eval("T") %></asp:Label></td>
                    <td id="TLD">
                        <asp:Label ID="Label7" runat="server" Style="font-weight: bold"><%# Eval("TL")%></asp:Label></td>
                    <td><span id="MainContent_Label2">75</span></td>
                </tr>
            </ItemTemplate>
        </asp:ListView>
    </div>

Answer 1

jquery方法

＆＃13;

$(function() {
  var td = document.getElementsByTagName("td");
  var i = 0,
    tds = td.length;
  for (i; i < tds; i++) {
    if (td[i].innerText == 75) {
      td[i].setAttribute("style", "background:green;");
    }
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table>
  <tbody>
    <tr>
      <td><span id="MainContent_Label1">80</span></td>
    </tr>

    <tr>
      <td><span id="MainContent_Label2">75</span></td>
    </tr>
  </tbody>
</table>

＆＃13;

或等效的纯JavaScript方法;

＆＃13;

(function() {
  var td = document.getElementsByTagName("td");
  var i = 0,
    tds = td.length;
  for (i; i < tds; i++) {
    if (td[i].innerText == 75) {
      td[i].setAttribute("style", "background:green;");
    }
  }
})();

＆＃13;

<table>
  <tbody>
    <tr>
      <td><span id="MainContent_Label1">80</span></td>
    </tr>

    <tr>
      <td><span id="MainContent_Label2">75</span></td>
    </tr>
  </tbody>
</table>

＆＃13;

JQuery无法在aspx页面中工作

1 个答案: