Javascript 仅隐藏<；李>；不重视孩子

可能重复：

我当前的输出是：

<div id="pro">
<li id="4331" style="display: none;">
Region
   <ul>
      <li id="4332">Asia</li>
      <li id="6621">Europe</li>
   </ul>
</li>
</div>

区域

亚洲
欧洲

它隐藏了一切

但我只想隐藏父区域
我希望能够单击它，然后单击“隐藏区域”并仅显示亚洲和欧洲。

如果可能，以不同的div-like显示这两个选项

单击区域，它在div 1中显示，在div 2中有子对象

然后再给出可能的答案

请帮我解决这个问题

---

谢谢。

如果不影响所有子元素，则无法将元素设置为“显示：无”（或其类似项）。事情就是这样。通过将父项

font size

设置为

0

并将子项的

font size

设置为某个可见值，仍然可以在显示子项内容时隐藏“父项”内容：

event.cancelBubble=true

可以替换为

e.stopPropagation（）

$（“li”）.hide（）应该是
$（this）.hide（）
。否则，它将影响文档中的所有

.live
已死亡。将代码至少更新为jQuery 1.7并使用
。在
上，您不能真正隐藏它，但可以通过抓取文本节点并删除它来删除它

$("li#4331").contents().filter(function() {
  return this.nodeType == 3;
}).remove();

如果可以使用
标记将“Region”包装起来，则可以更好地控制。
文本
Region
也是
的子节点，但它是文本节点，不是元素。您不应该使用以数字开头的
id
属性。为什么不将
区域
包装在
标记中并隐藏它？作为您的答案，它很有用，但我知道父项和子项的列表有多大，如何使用您的答案单击隐藏的任何位置。。。
<div id="pro">
<li id="4331" style="display: none;">
Region
   <ul>
      <li id="4332">Asia</li>
      <li id="6621">Europe</li>
   </ul>
</li>
</div>

$("li#4331").contents().filter(function() {
  return this.nodeType == 3;
}).remove();