javascript - 定位特定单元格的父行

Question

我有一个包含记录列表的表。每行都有“list_request”类，并且有一个“record_approval”类单元格:

<table>
<tr>
    <th>name</th><th>date</th><th>id</th><th>group</th><th>approval</th>
<tr class="list_request">
<td>Frank</td><td>2012-2-15</td><td>01</td><td>Account</td><td class="record_approval">Dave Ellis</td>
</tr>
<tr class="list_request">
<td>Ellen</td><td>2012-2-19</td><td>04</td><td>Admin</td><td class="record_approval">Susan Peters</td>
</tr>
<tr class="list_request">
<td>Michael</td><td>2012-2-26</td><td>06</td><td>Admin</td><td class="record_approval"></td>
</tr>

我想构造一个javascript函数来检查“record_approval”是否有值(哪个值不重要)，如果有，则更改该行的css颜色值。本质上，已批准的记录应具有与未批准的记录不同的颜色。类似...

function check_approval(){
    var checkrow = document.querySelectorAll( "tr.request_list" )
    var checkcell =  document.querySelectorAll( "td.record_approval" )

    for (i=0;i<checkcell.length;i++){  
    if (!checkcell.value){
        this.parentNode.style.color = "ff9900";
    }  
    else{

    }
}

这本质上是错误的方法吗？

Answer 1

我发现的错误:

• 未闭合的 for 循环(缺少闭合 })
• 您正在寻找 request_list 类，但在您的 html 上它是 list_request
• 您应该在循环中使用 checkcell[i] 而不是 checkcell
• 您的颜色十六进制值应以 # 开头。
• 无需从事件监听器获取所有行和单元格
• 不清楚您希望该函数何时运行。它应该响应事件吗？

此外，我会在行上设置一个新的 css 类，而不是直接设置颜色。

<小时/>

显然，您正在寻找这个:

var checkcell =  document.querySelectorAll( "td.record_approval" );
for (i=0;i<checkcell.length;i++){  
    if (checkcell[i].innerHTML){
        checkcell[i].parentNode.style.color = "#ff9900";
    }
}

http://jsbin.com/anadij/1/edit