javascript - $(this).find(..) 替代方案

Question

我发现自己在这样做，但不确定这是否是最好的方法。这里有一个例子。

<ul id="menubar">
  <li><a class="menu_item">File</a>
    <ul>
      <li><a id="menu_file_new">New</a></li>
      <li><a id="menu_file_open">Open</a></li>
    </ul>
  </li>
  <li><a class="menu_item">Run</a>
    <ul>
      <li><a id="menu_run_preview">Preview</a></li>
      <li><a id="menu_run_compile">Compile</a></li>
    </ul>
  </li>
</ul>

JQuery

$('.menu_item').hover(function(){
    $(this).find('ul').show();
});

只是想知道这是不是最好的方法，find 似乎有点矫枉过正？

---

编辑:因此我无法使用 css:在 Opera/IE 中单击/悬停项目时失败，在这两个浏览器中失败。 http://jsfiddle.net/cJsn2/1/这是因为 html 标准。

Answer 1

你只能用 CSS 来做到这一点

.menu_item ul { display: none; }
.menu_item:hover ul {display: block; }

至于JavaScript，没问题，可以用$.children代替$.find遍历更少的节点