search

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
WBOYOriginal
2016-05-16 16:06:481655browse

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>

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

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
Previous article：60 lines of js code to implement Tetris_javascript skillsNext article：60 lines of js code to implement Tetris_javascript skills

Related articles

See more