Javascript Reference - HTML DOM Table deleteCaption() Method








The deleteCaption() method removes the first <caption> element from the table.

Browser Support

deleteCaption Yes Yes Yes Yes Yes

Syntax

tableObject.deleteCaption() 

Parameters

None

Return Value

No return value





Example

The following code shows how to create and delete a <caption> element.


<!DOCTYPE html>
<html>
<head>
<style>
table, td {<!--from   w w  w  .  j  a  v  a  2  s . com-->
    border: 1px solid black;
}
</style>
</head>
<body>
<table id="myTable">
  <tr>
    <td>cell 1</td>
    <td>cell 2</td>
  </tr>
  <tr>
    <td>cell 3</td>
    <td>cell 4</td>
  </tr>
</table>
<br> 

<button onclick="myCreateFunction()">Create caption</button>
<button onclick="myDeleteFunction()">Delete caption</button>

<script>
function myCreateFunction() {
    var table = document.getElementById("myTable").createCaption();
    table.innerHTML = "<b>My table caption</b>";
}

function myDeleteFunction() {
    document.getElementById("myTable").deleteCaption();
}
</script>

</body>
</html>

The code above is rendered as follows:





Example 2

The following code shows how to remove the <caption> element from a table.


<!DOCTYPE html>
<html>
<head>
<style>
table, td {<!--from  w  w  w .j a v  a 2 s. c  om-->
    border: 1px solid black;
}
</style>
</head>
<body>
<table id="myTable">
<caption>This is a table caption</caption>
  <tr>
    <td>cell 1</td>
    <td>cell 2</td>
  </tr>
  <tr>
    <td>cell 3</td>
    <td>cell 4</td>
  </tr>
</table>
<br> 

<button onclick="myFunction()">test</button>

<script>
function myFunction() {
    document.getElementById("myTable").deleteCaption();
}
</script>

</body>
</html>

The code above is rendered as follows: