Question

我想选择表单的第一个div-child的第二个div-child。

如果我有这个HTML：

<form id="hello"></form>
<form method="get">
    <p class="search-box"></p>
    <div class="tablenav top">
        <div class="alignleft actions bulkactions"> </div>
        <div class="alignleft actions"></div>
        <div class='tablenav-pages one-page'></div>
    </div>
</form>
<div class="tablenav bottom"></div>

..我想选择＆＃34; tablenav top＆＃34;的第二个子div。形式中的div。然后在它旁边插入一个div。

这显然是错误的：

jQuery(document).ready(function($) {
    $("form div:first-child div:nth-child(2)").after("<div class='alignleft actions'><p>New div!</p></div>");   
});

编辑：我应该指定更多内容 - 第一个表单位于隐藏的div中，表单本身包含一些div。最后一个div也包含几个div。显然这会影响哪种代码可以工作。

Answer 1

试试这个

jQuery(document).ready(function($) {
    $($("form .tablenav .alignleft")[1]).after("<div class='alignleft actions'><p>New div!</p></div>");   
});

编辑：使用eq（1）获取jQuery对象数组中的第二个元素是一种更清晰的方式。

＆＃13;

jQuery(document).ready(function($) {
        $("form .tablenav .alignleft").eq(1).after("<div class='alignleft actions'><p>New div!</p></div>");   
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="hello"></form>
<form method="get">
    <p class="search-box"></p>
    <div class="tablenav top">
        <div class="alignleft actions bulkactions"> </div>
        <div class="alignleft actions"></div>
        <div class='tablenav-pages one-page'></div>
    </div>
</form>
<div class="tablenav bottom"></div>

＆＃13;

Answer 2

您需要使用SELECT * FROM ( SELECT a.IMSI, a.MSISDN, b.ROUTING_CATEGORY, c.apn FROM [Usage].[dbo].[MSISDN_IMSI] a, [Usage].[dbo].[IMSI_RC] b, [Usage].[dbo].[IMSI_QOS] c WHERE a.IMSI = b.IMSI AND c.IMSI = a.IMSI GROUP BY a.IMSI, a.MSISDN, b.ROUTING_CATEGORY, c.apn ) AS c PIVOT ( ) AS [pivot]，因为:first会查看容器中的所有元素，而不仅仅是指定的:first-child。另请注意，div索引是从1开始的，因此您要查找的nth-child实际上是div。试试这个：

nth-child(3)

Example fiddle

Answer 3

这对我有用：

jQuery(document).ready(function($) {
    $("form .tablenav > div:nth-child(2)").after("<div class='alignleft actions'><p>New div!</p></div>");   
});

看看这个 fiddle。

Answer 4

试试这个。

$( ".tablenav.top div:nth-child(2)" ).after(your code..)

Answer 5

$("form .tablenav > div:first div:nth-child(2)").after("<div class='alignleft actions'><p>New div!</p></div>");

为我工作

jQuery - 选择元素子元素

5 个答案: