Community Learn Tools Library Leisure

English

Home > Web Front-end > JS Tutorial > JS method to dynamically modify table cellPadding and cellSpacing_javascript skills

JS method to dynamically modify table cellPadding and cellSpacing_javascript skills

WBOY

Release： 2016-05-16 16:06:48

Original

1639 people have browsed it

The example in this article describes the method of dynamically modifying table cellPadding and cellSpacing with JS. Share it with everyone for your reference. The details are as follows:

The following JS code modifies the spacing of table cells by modifying the cellPadding and cellSpacing properties of the table object

<!DOCTYPE html>
<html>
<head>
<script>
function padding()
{
document.getElementById('myTable').cellPadding="15";
}
function spacing()
{
document.getElementById('myTable').cellSpacing="15";
}
</script>
</head>
<body>
<table id="myTable" border="1">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td>400</td>
</tr>
</table>
<br>
<input type="button" onclick="padding()"
value="Change Cellpadding">
<input type="button" onclick="spacing()"
value="Change Cellspacing">
</body>
</html>

Copy after login

I hope this article will be helpful to everyone’s JavaScript programming design.

Related labels：

cellpadding cellspacing js Dynamic modification sheet

source：php.cn

Previous article：60 lines of js code to implement Tetris_javascript skills Next article：Detailed tutorial on jQuery Ajax calling WCF service_jquery

Statement of this Website

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