在element.innerText中插入不间断空格

Question

在一个web应用中，我首先动态创建了一个非常大且相当复杂的表，其中大约有10,000个空单元格（一些单元格将保持为空，一些不为空）。我的第一种方法是使用innerHtml和不间断空格来防止空单元格被折叠：

td.innerHtml = ' ';

但那样有点慢。后来我发现使用innerText要比使用innerHtml快得多。所以我改变了我的代码为：

td.innerText = '\u00a0';

因为td.innerText = ' '只写入了文本" "在每个单元格中。它似乎在Internet Explorer 11中有效，但在Firefox中，空单元格的边框消失了。但是，如果我通过Firebug或其他方式检查单元格并将其与以前的版本进行比较，则看不到任何区别。

- Sebastian

---

Firefox不支持innerText，而是支持使用textContent。 - ndugger

“innerText”是微软的专有扩展，如果我没记错的话。 - little pootis

我不确定我理解"collapsing"是什么意思，也不知道为什么不能用CSS更有效率地解决这个问题。 - Pointy

不要用JS来修复这个问题。在你的CSS中使用empty-cells: show;。 - Peeke Kuepers

empty-cells 对我没用 :o - csomakk

Answer 1

element.innerText 不是标准属性。它由微软引入到Internet Explorer中，但其他浏览器不一定支持它（这就是为什么你看到了怪异的行为）。

使用 element.textContent 或重新考虑你的方法。生成一个有10k个空单元格的表格听起来像是一个非常糟糕的想法。

- Madara's Ghost

---

Chrome非常支持innerText。就像它支持document.all一样... - Florian Margaine

我从未说过没有其他浏览器支持它，我说的是没有人保证支持，因为它不是标准。 - Madara's Ghost

由于老版本的IE（例如IE9）存在textContent问题，因此我不得不同时使用两种方法。有关跨浏览器文本设置，请参见https://dev59.com/tWgu5IYBdhLWcg3wByi1。 - Sebastian

现在innerText已经被所有浏览器广泛支持。请参见https://caniuse.com/innertext - Josh Desmond

我的回答不变，坚持标准，避免怪异行为。值得注意的是，在2014年，innerText不是一个标准属性，它是后来添加到标准中以保持兼容性的。 - Madara's Ghost