我可以使用jQuery选择 #id > #id 吗?

can I select #id > #id with jQuery?

本文关键字：#id 我可以 jQuery 选择 可以使      更新时间：2023-09-26

我可以用jQuery选择 #id> #id 吗？

我有这个结构

<div id="slide1">
    <div id="slide_body">
    some content
    </div>
</div>
<div id="slide2">
    <div id="slide_body">
    some content
    </div>
</div>

有没有办法使用 jquery 只选择 #slide1 内部的 #slide_body？

或者是将 id 附加到每个正文div 的唯一解决方案，例如 

<div id="slide2">
    <div id="slide_2_slide_body">
    some content
    </div>
</div>

第一个问题的答案：

我可以使用 jQuery 选择 #id> #id 吗？

事实上，您可以执行确切的语法$('#slide1 > #slidebody')。>字符表示直系后代，称为子选择器 （http://api.jquery.com/child-selector/）。如果元素可能不是直接后代，而是嵌套在其他内容中，您将省略>并最终得到$('#slide1 #slidebody')。

至于HTML片段，大多数都正确地提到在不同的元素上具有相同的id是不好的，并且被认为是无效的文档。

http://jsfiddle.net/infiniteloops/LzFAr/

不能在一个文档中使用唯一 ID

此属性为元素分配名称。此名称必须是唯一的 在文档中。

http://www.w3.org/TR/html401/struct/global.html#h-7.5.2

在您的示例中，您可以使用类"slide_body"

<div id="slide1">
    <div class="slide_body">
    some content
    </div>
</div>

然后你可以用#slide1 .slide_body或$("#slide1").find('.slide_body')来选择它

使用 

$('#slide1 > #slide_body')

您的标记无效。不能有两个元素具有相同的 ID。因此，答案是否定的。请改用类。

<div id="slide1">
    <div class="slide_body">
    some content
    </div>
</div>
<div id="slide2">
    <div class="slide_body">
    some content
    </div>
</div>
$('#slide2>.slide_body');

同样的事情发生在我身上，我正在寻找解决方案，事实是这里发布的所有内容都不适合我，我找到了适合我的东西（$（'#container'）.find（'#child'））：

var div = $('#container').find('#child4').html();
alert(div);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
  Container:
  <div id="child1">Child Div 1</div>
  <div id="child2">Child Div 2</div>
  <div id="child3">Child Div 3</div>
  <div id="child4">Child Div 4</div>
  <div id="child5">Child Div 5</div>
</div>

ID 在

页面上应该是唯一的。请改用类： 

<div id="slide1">
    <div class="slide_body">
        some content
    </div>
</div>

然后#slide1 .slide_body作为选择器。

您可以这样选择，但是它是完全多余的id因为属性在页面中应该是唯一的。考虑到这一点，您当前的代码无效。应使用需要对标识符进行分组的class：

<div id="slide1">
    <div class="slide_body">
        some content
    </div>
</div>
<div id="slide2">
    <div class="slide_body">
        some content
    </div>
</div>

然后，您将使用：

var $slideContent = $('#slide1 .slide_body');

首先，拥有非唯一 id 并不是一个好决定。尽管如此，你可以在jQuery函数中传递上下文：

$("#slide_body", "#slide1")

HTML 元素的 id 应该是唯一的。 将幻灯片正文转换为类。

.HTML 

<div id="slide1">
    <div class="slide_body">
    some content
    </div>
</div>
<div id="slide2">
    <div class="slide_body">
    some content
    </div>
</div>

选择器

$("#slide1 .slide_body")
相关文章：