Hola, loquillo7
Lo que quieres se puede lograr usando las propiedades "display" o "visibility" de CSS.
He escrito esto; es muy primitivo --en particular para generalizarlo a un número diverso de filas y columnas--, pero espero que te dé ideas.
Lo ideal para gestionar las columnas será el árbol de nodos del DOM, pero con eso no tengo experiencia
Código HTML:
<head>
<script type="text/javascript">
function muestra(x)
{
var celdas = document.getElementsByTagName("td")
for (i=0; i<celdas.length; i++)
{
if ( celdas[i].id.indexOf("c4")!=-1 || celdas[i].id.indexOf("c5")!=-1 )
{
if (x) celdas[i].style.visibility="visible"
else celdas[i].style.visibility="hidden"
}
}
}
</script>
</head>
<body>
<table border="1" cellspacing="4">
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
<td id="f1c4" style="visibility:hidden;">D</td>
<td id="f1c5" style="visibility:hidden;">E</td>
</tr>
<tr>
<td>10</td>
<td>20</td>
<td>30</td>
<td id="f2c4" style="visibility:hidden;">40</td>
<td id="f2c5" style="visibility:hidden;">50</td>
</tr>
<tr>
<td>11</td>
<td>21</td>
<td>31</td>
<td id="f3c4" style="visibility:hidden;">41</td>
<td id="f3c5" style="visibility:hidden;">51</td>
</tr>
</table>
<a href="javascript:muestra(true)">mostrar más columnas</a><br>
<a href="javascript:muestra(false)">mostrar menos columnas</a>
</body>