Home/ Questions/Q 8979519
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-15T19:51:57+00:00

i want to remove one of the element which inside my table, i try

  • 0

i want to remove one of the element which inside my table,

i try to use tr.removeChild(tr.childNodes[2]);

to remove my third row elements, but it doesn’t really work 

function smile()
{
document.getElementById("p1").style.backgroundImage = 'url(smile.jpg)';
}
function twice()
{
document.getElementById("p2").innerHTML="Smile Smile";
}
function empty()
    {
//this is the part i want to remove , i want to remove the text inside it
    tr.removeChild(tr.childNodes[3]);
}

</script>
</head>

<body>

<table border = "1" >
<form>
<tr>
<th onclick="smile()"><input type="button" name="person1" value="Make it smile!" id="person4" size="30" </th>
<th onclick="twice()"><input type="button" name="person1" value="Make it smile twice!" id="person4" size="30" </th>
<th onclick="empty()"><input type="button" name="person1" value="Make it empty" id="person4" size="30" </th>
</tr>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Live demo: http://jsfiddle.net/SbDXC/

    I see a couple issues with your code.

    First, you need to define tr (see the demo).

    Second, in a table, using rows and cells is more reliable than childNodes. To remove the third cell (index 2) of the first row (index 0), simply use:

    table.rows[0].removeChild(table.rows[0].cells[2]);​

    The issue with childNodes is that in some browsers the line breaks will be counted as nodes.

    [Edit] Even shorter: table.rows[0].deleteCell(2);​

    • 0