Truy cập Javascript TR từ TD

Question

Tôi có một hàng trong bảng, và bên trong đó, tôi có một td (bất kể nó là gì). Tôi muốn thay đổi thuộc tính lớp của TR TD của tôi là trong mà không cần sử dụng một ID hoặc một tên. Như thế:

<tr> 
    <td onclick="[TR].setAttribute('class', 'newName')">My TD</td> 
</tr> 

Tôi làm như thế nào?

Answer 1

td đứng cho bảng dữ liệu ..

bây giờ .. trong trường hợp của bạn, bạn cần parentNode tài sản của td ..

<tr> 
<td onclick="this.parentNode.setAttribute('class', 'newName')">My TD</td> 
</tr> 

hoặc như bobince đề xuất trong mình nhận xét

<td onclick="this.parentNode.className= 'newName'">My TD</td> 

Answer 2

jQuery có lẽ là cách dễ nhất để làm điều này, bạn có thể sử dụng bộ chọn như:

$('table.mytable tr').addClass('red'); 

Để thêm một lớp của 'đỏ' cho tất cả của tr trong table.mytable. Đó chỉ là đỉnh của tảng băng trôi - kiểm tra xem nó có nên làm những gì bạn cần không.

Answer 3

Trong jquery, nó sẽ thực sự đơn giản nếu bạn có tham chiếu đến td của bạn:

$(this).closest('tr'); 

Nếu bạn thực sự không muốn mất một sự phụ thuộc vào jQuery, sau đó bạn có thể chỉ cần làm một vòng lặp nhận parentNode và kiểm tra kiểu của nó như là một giải pháp mục đích chung chung hơn. Trong trường hợp này, bạn chỉ có thể nhận được parentNode vì tr luôn là cha mẹ trực tiếp của td. Bạn có thể làm một cái gì đó như thế này (lưu ý điều này đã không được kiểm tra):

var parent = myTd.parentNode; 
while(true) { 
    if(parent == null) { 
    return; 
    } 
    if(parent.nodeName === "TR") { 
    return parent; 
    } 
    parent = parent.parentNode; 
} 

Answer 4

Nếu bạn có thể sử dụng jQuery nó có thể là một cái gì đó như thế này

$("yourtdselector").closest("tr").attr("class","classname"); 

Đối với mã của bạn

<tr> 
    <td onclick="changeClass(this,'classname')">My TD</td> 
</tr> 

function changeClass(elem, class) 
{ 
    elem.parentNode.className = class; 
} 

Answer 5

Without bất kỳ khung công tác bổ sung nào:

document.getElementById("theTableName").rows[1].cells[1].className = "someclassname"; 

Answer 6

nếu bạn có phần tử dom trong javascript, bạn có thể sử dụng .parentNode() sau đó sẽ cung cấp cho bạn nút perant, mà phải là hàng của bảng. sau đó bạn có thể thiết lập .className