为什么Chrome会为每个表格行添加tbody标记？

Question

我有两个表填满了一个事件。

样式表是为偶数行涂成白色而制作的。

@Override
public void doBack() {
    Fragment fragment = new MainFragment();
    getFragmentManager().beginTransaction()
            .replace(R.id.fragment_container, fragment)
            .commit();
}

但由于Chrome为每个table { border-collapse: collapse; width: 100%; } td, th { border: 1px solid #dddddd; text-align: left; padding: 8px; } tr:nth-child(even) { background-color: #dddddd; } 代码添加了tbody代码，因此无效。

第一个表填充后端：

tr

第二个完美无缺。它填满了var prueba = {}; prueba = nuevaCadena[nuevaCadena.length - 1].replace(/<br>/g, "").split(","); prueba.venta = prueba[0]; prueba.fecha = prueba[1]; prueba.heladeria = prueba[2]; //prueba.base.split(","); //if (myElem === null) { var contenido = document.getElementById("contenido"); var tr2 = document.createElement("TR"); if (contenido.getElementsByTagName("TH").length === 0) { contenido.appendChild(tr2); tr2.innerHTML += "<th>Heladeria</th>"; tr2.innerHTML += "<th>Fecha</th>"; tr2.innerHTML += "<th>ID</th>"; } else { var template = "<tr><td>{{heladeria}}</td><td>{{fecha}}</td><td>{{venta}}</td></tr>"; document.querySelector('#contenido').innerHTML += Mustache.render(template, prueba); } 标记值。

select

结果如下：

这个问题对我来说不起作用Why do browsers insert tbody element into table elements?我使用的是胡子。

Answer 1

在解析HTML语法时，浏览器将插入tbody标记，如Why do browsers still inject <tbody> in HTML5?中所述。通过每次附加到innerHTML，您每次都会创建一个新的tbody。 HTML语法不能将tr表示为表的直接子项。

您可以改为使用

tr = table.insertRow()
tr.innerHTML='<td>foo<td>bar'

如果您仍想使用innerHTML编写行，或者也使用td = tr.insertCell()。

Answer 2

不需要添加chrome的标记，也不应该影响您的代码。

如果您不断收到错误，可能需要尝试检查，确保没有遗漏任何字符。