如何在jQuery中检查元素是否在另一个元素中？

Is there any direct way in JavaScript or jQuery to check if an element is within another one.

在JavaScript或jQuery中是否有任何直接的方法来检查元素是否在另一个元素中。

I'm not referring to the $(this).parent as the element I wish to find can be a random number steps lower in the tree of elements.

我不是指$（this）.parent，因为我希望找到的元素可以是元素树中较低的随机数。

As an example, I would like to check if < div id="THIS DIV"> would be within < div id="THIS PARENT">:

举个例子，我想检查

是否在

中：

<div id="THIS_PARENT">
 <div id="random">
  <div id="random">
   <div id="random">
    <div id="THIS_DIV">
(... close all divs ...)

So in pseudo code:

所以在伪代码中：

 if($("div#THIS_DIV").isWithin("div#THIS_PARENT")) ...

If there isn't any direct way I'll probably do a function for this but still it's worth asking.

如果没有任何直接的方法我可能会为此做一个功能但仍然值得问。

2 个解决方案

#1

You could do this:

你可以这样做：

if($('#THIS_DIV','#THIS_PARENT').length == 1) {

}

By specifying a context for the search (the second argument) we are basically saying "look for an element with an ID of #THIS_DIV within an element with ID of #THIS_PARENT". This is the most succint way of doing it using jQuery.

通过指定搜索的上下文（第二个参数），我们基本上是说“在ID为#THIS_PARENT的元素中查找ID为#THIS_DIV的元素”。这是使用jQuery实现它的最简洁方式。

We could also write it like this, using find, if it makes more sense to you:

我们也可以这样写，使用find，如果它对你更有意义：

if($('#THIS_PARENT').find('#THIS_DIV').length == 1) {

}

Or like this, using parents, if you want to search from the child upwards:

或者像这样，使用父母，如果你想从孩子向上搜索：

if($('#THIS_DIV').parents('#THIS_PARENT').length == 1) {

}

Any of these should work fine. The length bit is necessary to make sure the length of the "search" is > 0. I would of course personally recommend you go with the first one as it's the simplest.

任何这些应该工作正常。长度位是必要的，以确保“搜索”的长度> 0.我当然会建议你选择第一个，因为它是最简单的。

Also, if you are referring to an element by ID it's not necessary (although of course perfectly okay) to preface the selector with the tag name. As far as speed, though, it doesn't really help as jQuery is going to use the native getElementById() internally. Using the tag name is only important when selecting by class, as div.myclass is much, much faster than .myclass if only <div> elements are going to have the particular class.

此外，如果您通过ID引用元素，则不必（尽管当然完全可以）在选择器前面添加标记名称。但就速度而言，它并没有真正帮助，因为jQuery将在内部使用本机getElementById（）。使用标记名称仅在按类选择时很重要，因为如果只有

元素具有特定类，div.myclass比.myclass快得多。

#2

With jQuery >=1.4 (2010) you can use the very fast function jQuery.contains()

使用jQuery> = 1.4（2010），您可以使用非常快速的函数jQuery.contains（）

This static method works with DOM elements, not with jQuery elements and returns true or false.

此静态方法适用于DOM元素，而不是jQuery元素，并返回true或false。

jQuery.contains( container, descendant )

Example: To check if a element is in the document you could do this:

示例：要检查元素是否在文档中，您可以执行以下操作：

jQuery.contains( document.body, myElement )

#1