使用Jquery检测Table的长度具体说明

Question

我有一段代码运行良好，但我想改进它以检测 table 的长度并根据它给出描述。

这基本上是一个产品目录，我用wordpress条目来展示产品描述。大多数条目包含 table，有些则不包含。如果 table 存在，则会创建指向 table 中特定点的 link，点击后访问者会到达那里。当检测到 NO table 时，会给出相应的说明。

我想做的改进是添加一个附加条件，如果 table 的长度只有 4 行或更少，则对该条件有不同的描述，例如

elTitulo.after("<a href='#tablesp' class='speclink'>Ver BREVE Tabla de Especificaciones</a> ");   (BREVE = BRIEF)

而且我不确定如何整合该部分。它是否需要现有条件内的条件？还是一个全新的条件？

<script>
    jQuery(document).ready(function($) {
        var elTitulo = $(".entry-title");
        $("tbody").before("<div id='tablesp'></div>");
        if ($('table').length) {
            elTitulo.after("<a href='#tablesp' class='speclink'>Ver Tabla de Especificaciones</a> ");
        } else {
            elTitulo.after("<p class='speclink'>(No hay tabla especial de especificaciones. Breve descripción disponible)</p> ");
        }
    });
</script>

Answer 1

这应该可行，但您的代码假定页面中只有一个 table。此外，添加 div 洞察你的 tbody 也不是一个好主意。

jQuery(document).ready(function($) {
    var elTitulo = $(".entry-title");
    $("tbody").before("<div id='tablesp'></div>");
    if ($('table').length) {

      if($('table tbody tr').length < 4){
        // There are less then 4 rows (not including 4)
        elTitulo.after("<a href='#tablesp' class='speclink'>Ver BREVE Tabla de Especificaciones</a> ");
      } else {
        elTitulo.after("<a href='#tablesp' class='speclink'>Ver Tabla de Especificaciones</a> ");
      }

    } else {
        elTitulo.after("<p class='speclink'>(No hay tabla especial de especificaciones. Breve descripción disponible)</p> ");
    }
});

使用Jquery检测Table的长度具体说明

Use Jquery to Detect length of Table for specific description

wordpress

jquery

conditional

if-statement