Question

我正在尝试使用jQuery来选择div，但忽略所选的所有divs选定div的子项。除了我匹配的divs之外，HREF除了outerdiv = $('a[href^="http://bizmate."]').closest('div'); outerdiv.prepend("This was selected")之外没有任何其他方法可以识别它们。例如：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>Won't be selected
  <div>
    Powered by <a href="http://bizmate.in">Bizmate</a>
    <div>
      Powered by <a href="http://bizmate.in">Bizmate</a>
      <div>
        Powered by <a href="http://bizmate.in">Bizmate</a>
      </div>
    </div>
  </div>
</div>

<div>
  <div>
    Powered by <a href="http://bizmate.in">Bizmate</a>
  </div>
</div>

divs

此代码选择所有divs，包括孩子。如何将其限制为仅选择满足条件的最外层div而忽略同时满足给定条件的子class Service { public: void start(); void stop(); private: HANDLE hThread; HWND hWindow; }; void Service::start() { hThread = CreateThread(...); // creates window and goes on to message loop } void Service::stop() { // !!! wait for m_hwnd to become valid // send signal to thread to stop PostMessage(m_hwnd, WM_CLOSE, 0, 0); // wait to thread to die ::WaitForSingleObject(hThread, INFINITE); CloseHandle(hThread); }？

修改

目前，该示例将提供：

不会被选中
这是由Bizmate提供的这是由Bizmate提供的这是由Bizmate提供的这是由Bizmate选择的

我希望结果为：

不会被选中
这是由Bizmate提供的由Bizmate提供技术支持由Bizmate提供技术支持这是由Bizmate选择的。

Answer 1

使用has()和last()。

a[href^="http://bizmate."]：选择href值以（^）＆＃34; http://bizmate开头的所有锚元素。＆＃34;。
:last：从匹配集
closest('div')：获取最接近的匹配祖先

<强>演示：

＆＃13;

$('div > a[href^="http://bizmate.in"]').each(function() {
  $(this).parents('div:has(> a[href^="http://bizmate.in"])')
    .last().addClass('hello');
});

＆＃13;

.hello > a {
  border: solid 1px green;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>Won't be selected
  <div>
    Powered by <a href="http://bizmate.in">Bizmate</a>
    <div>
      Powered by <a href="http://bizmate.in">Bizmate</a>
      <div>
        Powered by <a href="http://bizmate.in">Bizmate</a>
      </div>
    </div>
  </div>
</div>

<div>
  <div>
    Powered by <a href="http://bizmate.in">Bizmate</a>
  </div>
</div>

＆＃13;

Answer 2

这将选择任何顶级父级，与群集数量或其确切结构无关，方法是根据在树下找到的链接数量过滤掉子级：

＆＃13;

var link = 'a[href^="http://bizmate."]',

outerdiv = $(link).filter(function() {

    var total = $(this).parents('div:last').find(link).length;

    if (total > 1) {
      var parent = $(this).closest('div').find(link).length;
      if (parent == total) return $(this);
    }
    else return $(this);

}).closest('div');

outerdiv.prepend("This was selected");

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div>Won't be selected
  <div>
    Powered by <a href="http://bizmate.in">Bizmate</a>
    <div>
      Powered by <a href="http://bizmate.in">Bizmate</a>
      <div>
        Powered by <a href="http://bizmate.in">Bizmate</a>
      </div>
    </div>
  </div>
</div>

<div>
  <div>
    Powered by <a href="http://bizmate.in">Bizmate</a>
  </div>
</div>

＆＃13;

Answer 3

 $('a').click(function(event){
   event.preventDefault();
   var x = $(this).closest('div')
   $(x).prepend("This was selected");
 });

Answer 4

您可以将一个类添加到父div并执行以下操作：

<强> HTML：

<div>Won't be selected
  <div class="test">
    Powered by <a href="http://bizmate.in">Bizmate</a>
    <div>
      Powered by <a href="http://bizmate.in">Bizmate</a>
      <div>
        Powered by <a href="http://bizmate.in">Bizmate</a>
      </div>
    </div>
  </div>
</div>

<div>
  <div class="test">
    Powered by <a href="http://bizmate.in">Bizmate</a>
  </div>
</div>

<强> JS：

outerdiv = $('a[href^="http://bizmate."]').closest('div.test');
$(outerdiv).prepend("This was selected")

这是小提琴： https://jsfiddle.net/hg989ffp/

jquery选择所选div的嵌套的最外层div

4 个答案: