1

Tengo una tabla así:

<table id="mi_tabla">
  <tr>
    <th></th>
    <th style="display: none;"></th>
    <th></th>
    <th></th>
  </tr>
  <tr>
    <td></td>
    <td style="display: none;"></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td style="display: none;"></td>
    <td></td>
    <td></td>
  </tr>
</table>

y quiero remover esas columnas que tienen display none, como puedo hacerlo?

Gracias!!

2 respuestas 2

2

En una sola linea podes hacerlo con CSS Selectors

En este ejemplo que te dejo selecciono todos los elementos que tengan "display none" y luego los remuevo.

$(document).ready(function(){
  $("#mi_tabla [style*='display: none']").remove()
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table id="mi_tabla">
  <tr>
    <th>1</th>
    <th style="display: none;">2</th>
    <th>3</th>
    <th>4</th>
  </tr>
  <tr>
    <td>1</td>
    <td style="display: none;">2</td>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>1</td>
    <td style="display: none;">2</td>
    <td>3</td>
    <td>4</td>
  </tr>
</table>

1

Puedes utilizar un selector jQuery que busque los elementos con el estilo display: none. Si inspeccionas la tabla, veras que los elementos han sido removidos:

$(document).ready(function() {
  var th = $("#mi_tabla").find("tr th[style='display: none;']").remove();
  $("#mi_tabla").find("tr td[style='display: none;']").remove();
  $("#append").on("click", function() {
    $("#mi_tabla").find("th:first").after(th);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table id="mi_tabla">
  <tr>
    <th>1</th>
    <th style="display: none;">2</th>
    <th>3</th>
    <th>4</th>
  </tr>
  <tr>
    <td>1</td>
    <td style="display: none;">2</td>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>1</td>
    <td style="display: none;">2</td>
    <td>3</td>
    <td>4</td>
  </tr>
</table>
<button id="append">Pegar</button>

4
  • Esta super pero ya tengo otra duda, al removerlos como puedo restablecer la tabla luego?? Commented el 3 jul. 2018 a las 16:49
  • Si quieres removerlos momentaneamente, debes de guardarlos en una variable y utilizar detach() en lugar de remove()
    – alanfcm
    Commented el 3 jul. 2018 a las 16:50
  • Y de casualidad podrías explicarme como? Commented el 3 jul. 2018 a las 16:59
  • Ya edite mi respuesta con un ejemplo de como restaurar el th
    – alanfcm
    Commented el 3 jul. 2018 a las 17:07

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.