Javascript jQuery:父选择器在jQuery UI对话框中无法按预期工作

我有一个jQueryUI对话框，我想在没有标题的情况下呈现它。我已经让它工作了，这不是问题所在

我好奇的是，为什么jQuery:parent选择器不会选择对话内容div的父对象，但父对象函数会选择。下面是一个成功的例子：

HTML:

以下是JSFIDLE中的上述代码：

在chrome中，如果在渲染对话框后设置断点，如果按预期执行$throbber:parent，它会选择自身：

如果我尝试选择它的父对象：它不选择，它只会再次选择自己：

如果我使用$throbber.parent，这次它将选择其父项：

这里发生了什么，为什么不：parent还没有选择throbber的父元素。parent会选择吗？

获取当前匹配元素集中每个元素的父元素，可选地通过选择器过滤

选择作为另一个元素的父元素的所有元素，包括文本节点

$throbber.parent.find.ui-dialog-titlebar从throbber上升到父级，然后下降到.ui-dialog-titlebar。可以访问throbber的兄弟姐妹

$throbber:parent.ui对话框标题栏正在检查throbber是否为父级，然后转到.ui对话框标题栏。只能访问throbber的子元素。

获取当前匹配元素集中每个元素的父元素，可选地通过选择器进行筛选

选择作为另一个元素的父元素的所有元素，包括文本节点

$throbber.parent.find.ui-dialog-titlebar从throbber上升到父级，然后下降到.ui-dialog-titlebar。可以访问throbber的兄弟姐妹

---

$throbber:parent.ui对话框标题栏正在检查throbber是否为父级，然后转到.ui对话框标题栏。只能访问throbber的子元素。

我不认为：parent可以这样使用-它只是过滤您已经拥有的选择器，以便只匹配作为其他元素父元素的对象请参见：。所以它匹配throbber元素，因为它正在寻找名为throbber的元素，它是父元素

我不认为：parent可以这样使用-它只是过滤您已经拥有的选择器，以便只匹配其他元素的父对象请参见：。所以它匹配throbber元素，因为它正在寻找名为throbber的元素，它是父元素

来自：

描述：选择作为另一个元素的父元素的所有元素，包括文本节点

因此，当您执行$throbber:parent时，jQuery所做的是查找id为throbber的元素，该元素恰好是另一个元素的父元素，在本例中是p和img标记

另一方面，选择当前选择器的父级，因此执行$throbber.parent将找到id为throbber的元素的父级。

来自：

描述：选择作为另一个元素的父元素的所有元素，包括文本节点

因此，当您执行$throbber:parent时，jQuery所做的是查找id为throbber的元素，该元素恰好是另一个元素的父元素，在本例中是p和img标记

---

另一方面，选择当前选择器的父级，因此执行$throbber.parent将找到id为throbber的元素的父级。

确实如此。顺便提一下，记住区别的一个好方法是，所有伪选择器都将选择器修改为某种类型，例如：：button选择按钮元素，：hidden选择隐藏元素，类似地，：parent选择父元素。很好，我现在不会忘记这一点。顺便提一下，记住区别的一个好方法是，所有伪选择器都将选择器修改为某种类型，例如：：button选择按钮元素，：hidden选择隐藏元素，类似地，：parent选择父元素。很好，我现在不会忘记这一点。

<input id="example1" type="button" value="Use :parent selector">
<input id="example2" type="button" value="Use parent() function">

<!-- 
One of many dialogues on the page, but this one needs
the title removed.
-->

<div id="throbber" style="display:none">
    <p>Doing work...be patient....</p>
    <img src="http://i.stack.imgur.com/GUw9u.gif"/>
</div>

$("#example1").bind("click", function() {
    $("#throbber").dialog("destroy"); // for jsfiddle example
    $("#throbber").dialog({
        resizable: false,
        modal: false,
        width: 150
    });

    $("#throbber:parent .ui-dialog-titlebar").hide();
});

$("#example2").bind("click", function() {
    $("#throbber").dialog("destroy"); // for jsfiddle example
    $("#throbber").dialog({
        resizable: false,
        modal: false,
        width: 150
     });

    $("#throbber").parent().find(".ui-dialog-titlebar").hide();
});