javascript - 使用 jquery 只获取直接元素值

Question

假设我的菜单有以下内容:

$(document).ready(function() {
  alert($('ul li').html());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul class="menu">
  <li><i class="font-icon"></i> Users
      <ul>
        <li>Overview</li>
      </ul>
    </li>
</ul>

如您所见，我得到的返回是:

<i class="font-icon"></i> Users
<ul>
   <li>Overview</li>
</ul>

现在的问题是我只对:<i class="font-icon"></i> Users感兴趣.有没有办法只把它作为返回而不把它放在 div 中？或 span ？我已经尝试过 .text()但这只给了我实际的文字 Users (显然)。

提前致谢

Answer 1

我认为这可能是解决方案: DEMO

$(document).ready(function() {
    var i=$('ul li').html();
    var ul=$('ul li').find('ul')[0].outerHTML;
    i=i.replace(ul,'');
    alert(i);
});