Home  >  Article  >  Web Front-end  >  How to delete tr in javascript

How to delete tr in javascript

藏色散人
藏色散人Original
2021-07-05 14:40:323196browse

How to delete tr in javascript: first create an HTML sample file; then define the table; finally delete the tr element through the "function delete2(obj){...}" method.

How to delete tr in javascript

The operating environment of this article: windows7 system, javascript version 1.8.5, Dell G3 computer.

How to delete tr in javascript?

Javascript delete tr element

Javascript

             function delete1(obj){
var tr=obj.parentNode.parentNode;
    var tbody=tr.parentNode;
    tbody.removeChild(tr);
}
//使用Jquery 删除
function delete2(obj){
$(obj).parent().parent().parent()[0].removeChild($(obj).parent().parent()[0]);
}
//该方式只是将TR 元素隐藏
function hide(obj){
$(obj).parent().parent().hide();
}

HTML

<table>
<tbody>
<tr>
<td>xxx1</td>
<td><span οnclick="delete1(this)">删除</span></td>
</tr>
<tr>
<td>xxx1</td>
<td><span οnclick="delete2(this)">删除</span></td>
</tr>
<tr>
<td>xxx1</td>
<td><span οnclick="hide(this)">隐藏</span></td>
</tr>
</tbody>
</table>

Recommended study: "javascript Advanced Tutorial

The above is the detailed content of How to delete tr in javascript. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn