12

我在使用 jquery 时遇到问题。我的 HTML 是

<div id="first">
   <span class="test"></span>
</div>
<div id="second">
   <span class="test"></span>
<div>

现在我正在尝试使用 Jquery 在跨度中添加文本。

$j('span.test').text('Welcome');

之后就变成了，

<div id="first">
    <span class="test">Welcome</span>
</div>
<div id="second">
    <span class="test">Welcome</span>
<div>

但是，我正在努力实现的是，

<div id="first">
    <span class="test">Welcome</span>
</div>
<div id="second">
    <span class="test"></span>
<div>

我怎么能在jquery中做到这一点？

4

5 回答 5

14

几种可能的选择

其他人已经提供了他们的答案，但让我给你一些更多的选择。

$("span.test:first").text("Welcome");
$("#first span.test").text("Welcome");
$("span.test").first().text("Welcome");
$("span.test").eq(0).text("Welcome");
$("span.test", "#first").text("Welcome");

第二个也是最后一个可能是最快的，因为它们按 ID 定位特定容器。
（内部 jQuery 优化可能会证明我对任何未来版本的错误）

性能比较

这是一个JSPerf 测试，其性能比较了较高的可能性。正如预期的那样，第二种和最后一种方法是最快的，因为元素选择被大大简化了。我已经尝试在 Chrome 上运行它们，如果您想查看差异，您可以在其他浏览器中运行它们。

于 2013-01-11T13:04:51.480 回答
5 
$('#first span.test').text('Welcome');

jQuery 选择器是用一点魔法扩展的 CSS 选择器。你可以在这里找到你需要知道的一切：http: //api.jquery.com/category/selectors/

于 2013-01-11T12:57:56.707 回答
1

您需要使用:first选择器表示您只想将文本添加到选择器找到的第一个元素。试试这个：

$j('span.test:first').text('Welcome');

示例小提琴

或者，您可以使用id父 div 的 来使选择器唯一：

$j('#first .test').text('Welcome');
于 2013-01-11T12:55:21.937 回答
0

在这个例子中，你可以做什么 RoRyMcCrossan 对于一般选择，我建议你看看这个：http ://api.jquery.com/child-selector/

或者你可以使用这个

http://api.jquery.com/eq-selector/

于 2013-01-11T13:09:31.607 回答
0

由于您有一个 id，通常在一页上是唯一的，因此最好使用以下内容：

$("#first span.test").text("Welcome");
于 2013-01-11T13:14:35.467 回答