javascript - div内的jQuery选择器锚点

Question

我有以下 HTML 代码：

<div id="mycontainer">
   <p> title </p>
   <ul>
   <li><span>**</span><a href="...">KEY</a></li>
   </ul>
   <ul>
   ...
   </ul>
</div>

我将如何获得 KEY 值？换句话说，从这个 id = "mycontainer" 的 div 中，我将如何从第一个 ul 中获取元素的内容？

Answer 1

$("#mycontainer ul:first a").text();

在这里，有一个小提琴：http: //jsfiddle.net/8tvTt/

Answer 2

这样的事情将实现你所追求的：

$("#mycontainer ul:first a").text();

Answer 3

这有效：

$('#mycontainer ul:eq(0) a').text();

这也有效：（更具可读性）

$('#mycontainer ul:first a').text();

Answer 4

用这个：

$('#mycontainer a').text();

Answer 5

虽然许多现有的答案将实现您所追求的，但我认为您真正要求的（或至少您真正需要的）是对jQuery 选择器和DOM 遍历的一些熟悉。

很多人似乎都假设您想要链接元素的内部文本，我不确定是否如此。在不提供此标记的变化并且不考虑选择器的速度的情况下，任何数量的答案都可以满足您的需求，包括一些愚蠢的东西，$('a').text();因为它是a您提供的标记中唯一的。我们只能猜测情况。了解每个答案的工作原理（以及为什么不成功的答案不这样）以及为什么会更有帮助。

选择器的特殊性是可取的，但您必须权衡通过 DOM 的实际代价高昂的旅行的成本和收益。你会一直得到链接的文本内容吗？它可能包含html吗？你真的想得到包装<a>吗？

如果您只想要唯一ainside的文本内容#mycontainer，请确定：

$("#mycontainer ul:first a").text();

但$('#mycontainer').find('a').text();可能会更快。（等等，什么是find()？，你问，为什么它更快？）但是如果 KEY 被格式化了<strong>，并且你希望它延续到你正在用它做的任何事情上呢？您可能想.html()改用。如果你想要它a本身，为什么不：

$("#mycontainer ul:first a");

但是如果每个li人都有一个a?

$("#mycontainer ul:first li:first a").clone();

你也想要跨度吗？

$("#mycontainer ul:first li:first").clone();

或者

$("#mycontainer ul:first li:first").html();

你也想要包装<li>吗？

$("#mycontainer ul:first li:first").clone();

玩玩，多读一些，然后你不会让每个人（包括我自己）都如此贪婪地寻找一些愚蠢的、简单的代表。

Answer 6

你需要阅读 jquery 选择器...但是使用这个

$('#mycontainer ul:first a').text();