tagify - ¿Cómo fuerzo a jQuery anexar para NO cerrar automáticamente una etiqueta?
tags component jquery (2)
Tengo un objeto JavaScript con aproximadamente 1000 propiedades y quiero crear una <table> de estas entradas, con ocho propiedades en una sola fila, <tr> .
Estoy usando jQuery append() ; sin embargo, se agrega automáticamente una etiqueta de cierre </tr> . Quiero definir manualmente dónde debería ir el cierre </tr> . ¿Cómo logro esto?
El objeto:
var g2u = {};
g2u.a1 = "";
g2u.a2 = "";
g2u.a3 = "";
g2u.a4 = "";
g2u.a5 = "";
g2u.a5a = "";
g2u.a6 = "";
g2u.a6a = "";
g2u.a6b = "";
... etc...
La <table> :
<table id="list" border="1">
</table>
<script>
var ctr = 0;
$("#list").append(''<tr>'');
for (var g in g2u) {
$("#list").append(''<td><span class="rom">''+g+''</span>/n'');
$("#list").append(''<span class="eh">''+g2u[g]+''</span>/n'');
$("#list").append(''<span class="rom"> </span></td>/n'');
ctr++;
if (ctr % 8 == 0) {
$("#list").append(''</tr><tr>/n'');
}
}
La salida rota :
<tbody><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr></tbody>
<td><span class="rom">a1</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a2</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a3</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a4</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a5</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a5a</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a6</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a6a</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a6b</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a7</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a8</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a9</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a10</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a11</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a12</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a13</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a14</span></td><span class="eh"></span><span class="rom"> </span><td><span class="rom">a14a</span></td><span class="eh"></span><span class="rom"> </span><td><spa
Está pensando en términos de marcado html, con el uso de apéndice debería estar pensando en términos de html DOM , no tiene etiquetas abiertas y elementos de etiqueta cerrada solo.
Puede usar una cadena para construir su html y luego adjuntarlo a la tabla
var ctr = 0;
var innerTable = ''<tr>'';
for (var g in g2u) {
innerTable += ''<td><span class="rom">''+g+''</span>/n'';
innerTable += ''<span class="eh">''+g2u[g]+''</span>/n'';
innerTable += ''<span class="rom"> </span></td>/n'';
ctr++;
if (ctr % 8 == 0) {
innerTable += ''</tr><tr>/n'';
}
}
$("#list").append(innerTable);
Si lo añades obviamente intentarás cerrar las etiquetas. Intente colocar su html en una cadena que agregue esa cadena a la dom.
<script>
var ctr = 0;
var html=''<tr>'';
for (var g in g2u) {
html+=''<td><span class="rom">''+g+''</span>/n'';
html+=''<span class="eh">''+g2u[g]+''</span>/n'';
html+=''<span class="rom"> </span></td>/n'';
ctr++;
if (ctr % 8 == 0) {
html+=''</tr><tr>/n'';
}
}
$("#list").append(html);