无法通过JS更改显示

13 浏览
0 Comments

无法通过JS更改显示

我发现自己在使用JavaScript时遇到了childNodes和children属性。我想知道它们之间的区别是什么。还有，其中一个更受推荐吗？

0

2 答案

0 Comments

问题出现的原因是由于使用JavaScript无法通过修改display属性来改变元素的显示状态。这个问题可以通过以下方法解决。

解决方法：

- 使用Element.children方法可以获取元素的子元素节点，而Node.childNodes方法可以获取所有的子节点，包括元素节点和文本节点。注意，元素节点也是节点，所以两种方法都可以在元素上使用。

- 通常情况下，childNodes方法更可靠。例如，MDC（上面的链接）指出，在IE 9之前，IE只能正确地使用children方法。而childNodes方法则对浏览器的实现者提供了更少的错误空间。

- 遗憾的是，如果这个方法在IE 6-8上能够正常工作，那就太完美了。

- 事实上，这个方法确实可以使用（在某种程度上）。显然，.children方法不会过滤掉注释节点，但是它会过滤掉文本节点。

- 同样的问题也出现在.getElementsByTagName('*')方法上。IE有时候真的很令人恼火...

- 可以使用一些shim/polyfill的实现来支持IE中的children方法。

0
0 Comments

最近的回答已经很好了，我只想补充一点，你可以使用nodeType来检查节点的类型：

yourElement.nodeType

这将给您一个整数：（取自这里）

| 值 | 常量 | 描述 |

|----|----------------------|-------------------------------------------------------|

| 1 | Node.ELEMENT_NODE | 像<p>或<div>这样的元素节点。 |

| 2 | Node.ATTRIBUTE_NODE | 元素的属性。在DOM4规范中，元素属性不再实现Node接口。 |

| 3 | Node.TEXT_NODE | 元素或属性的实际文本。 |

| 4 | Node.CDATA_SECTION_NODE | CDATASection。 |

| 5 | Node.ENTITY_REFERENCE_NODE | XML实体引用节点。在DOM4规范中已删除。 |

| 6 | Node.ENTITY_NODE | XML <!ENTITY ...>节点。在DOM4规范中已删除。 |

| 7 | Node.PROCESSING_INSTRUCTION_NODE | XML文档的ProcessingInstruction，如<?xml-stylesheet ... ?>声明。 |

| 8 | Node.COMMENT_NODE | 注释节点。 |

| 9 | Node.DOCUMENT_NODE | 文档节点。 |

| 10 | Node.DOCUMENT_TYPE_NODE | DocumentType节点，例如HTML5文档的<!DOCTYPE html>。 |

| 11 | Node.DOCUMENT_FRAGMENT_NODE | DocumentFragment节点。 |

| 12 | Node.NOTATION_NODE | XML <!NOTATION ...>节点。在DOM4规范中已删除。 |

请注意，根据Mozilla的说法：

以下常量已被弃用，不应再使用：Node.ATTRIBUTE_NODE，Node.ENTITY_REFERENCE_NODE，Node.ENTITY_NODE，Node.NOTATION_NODE

根据上述内容，我们可以看到通过JavaScript无法通过更改显示的方式来改变display属性的值。

0