Post by jaroessa on Jul 30, 2004 3:50:05 GMT
Using the Methods: deleteCell and deleteRow
Before I start in, I'm assuming you understand the basics of JS. The two Methods at hand are not difficult, but, you won't be able to use them, if you've never used JS before.
The two Methods I'll give an explanation to, in this tutorial, are deleteCell and deleteRow. They're used to completely rid yourself of a specific cell/row, usually in a table (TD being a Cell, TR being a Row). They're useful, as when you simple clear the HTML out of a row, you're not getting rid of it completely. So, if there's a border around that row, it'll remain.
The script I'll be working with, to show you how this all works, modifies the Welcome Table. So, get a test board somehow, and try some of these out =P
Here's the deleteRow script:
<script>
var TA = document.getElementsByTagName("TABLE")[0]
TA.deleteRow(TA.rows.length - 1)
</script>
I shouldn't need to explain the first line of the body. But, for those that don't know much about JS, and still read on: It's grabbing the first TABLE Element in the BODY of the document.
The second line is where the action takes place. To use the Method, you need to assign it to an Object. The object in our case is the variable TA. Now, in the deleteRow Method there's one thing that needs to be specified. That being, which Row you want to delete. You could use a simple number, specifying. But, there's always the chance you won't know the Row Number. In this case, I want to remove the very last Row of the Welcome Table (The Menu Bar). So, I'm going to use a little Method to get the number of Rows. That being: .rows.length. "rows" recognizes all TRs in that TABLE, "length" checks to see how many exist. So, if there are 3 Rows, then it'll return 3, and the script will delete that 3rd Row. But, the current script will only return 2, as there's only 2 Rows =P And, as we all know, JS is based off of 0, so if there are 2 Rows, you'll need to delete row "1". That's why I have the "- 1" at the end. As, oddly enough, rows.length will return the exact number of Rows, not based off of 0.
Now, with deleteRow shown, lets see the deleteCell example:
<script>
var TR = document.getElementsByTagName("TR")[0]
TR.deleteCell(TR.cells.length - 1)
</script>
You should be able to understand this, now that you understand the deleteRow Method =P But, for a quite recapse: deleteCell is the Method being used on the TR Object. There needs to be one parameter, which Cell is to be deleted. The parameter we use checks to see how many Cells are in that Row and subtracts 1 as JS is based off of 0.
~ Squall
Before I start in, I'm assuming you understand the basics of JS. The two Methods at hand are not difficult, but, you won't be able to use them, if you've never used JS before.
The two Methods I'll give an explanation to, in this tutorial, are deleteCell and deleteRow. They're used to completely rid yourself of a specific cell/row, usually in a table (TD being a Cell, TR being a Row). They're useful, as when you simple clear the HTML out of a row, you're not getting rid of it completely. So, if there's a border around that row, it'll remain.
The script I'll be working with, to show you how this all works, modifies the Welcome Table. So, get a test board somehow, and try some of these out =P
Here's the deleteRow script:
<script>
var TA = document.getElementsByTagName("TABLE")[0]
TA.deleteRow(TA.rows.length - 1)
</script>
I shouldn't need to explain the first line of the body. But, for those that don't know much about JS, and still read on: It's grabbing the first TABLE Element in the BODY of the document.
The second line is where the action takes place. To use the Method, you need to assign it to an Object. The object in our case is the variable TA. Now, in the deleteRow Method there's one thing that needs to be specified. That being, which Row you want to delete. You could use a simple number, specifying. But, there's always the chance you won't know the Row Number. In this case, I want to remove the very last Row of the Welcome Table (The Menu Bar). So, I'm going to use a little Method to get the number of Rows. That being: .rows.length. "rows" recognizes all TRs in that TABLE, "length" checks to see how many exist. So, if there are 3 Rows, then it'll return 3, and the script will delete that 3rd Row. But, the current script will only return 2, as there's only 2 Rows =P And, as we all know, JS is based off of 0, so if there are 2 Rows, you'll need to delete row "1". That's why I have the "- 1" at the end. As, oddly enough, rows.length will return the exact number of Rows, not based off of 0.
Now, with deleteRow shown, lets see the deleteCell example:
<script>
var TR = document.getElementsByTagName("TR")[0]
TR.deleteCell(TR.cells.length - 1)
</script>
You should be able to understand this, now that you understand the deleteRow Method =P But, for a quite recapse: deleteCell is the Method being used on the TR Object. There needs to be one parameter, which Cell is to be deleted. The parameter we use checks to see how many Cells are in that Row and subtracts 1 as JS is based off of 0.
~ Squall