blocks|key|2929886|text|你不能在if条件下只使用find。您可以使用has或检查length属性。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2929887|var+elm+=+$('.parent1');
if(elm.has('.child3')){
+++var+child3+=+elm.find('.child3');
}|code-block|syntax|javascript|2929888|或者简单地像这样|2929889|var+child3+=+$('.parent1').find(".child3");
if(child3.length+>+0)+{
++//+child3+is+present
}|2929890|entityMap^0|4|2|C|4|M|3|S|6|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]|$9|T|A|U|B|C]|$9|V|A|W|B|C]|$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|Z|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|10|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|11|8|@]|D|@]|E|$I|J]]|$1|O|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|P|$]]

<p>You couldn't use just <code>find</code> in <code>if</code> condition. You could use <code>has</code> or check for the <code>length</code> property.</p>

<pre><code>var elm = $('.parent1');
if(elm.has('.child3')){
   var child3 = elm.find('.child3');
}
</code></pre>

<p>Or simply like this</p>

<pre><code>var child3 = $('.parent1').find(".child3");
if(child3.length &gt; 0) {
  // child3 is present
}
</code></pre>


blocks|key|2717301|text|您可以使用.length属性来检查元素是否存在。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2717302|var+elem+=+$(".parent2").find(".child3");
if(elem.length){
++++alert(elem.text());
}else{
++++alert('Element+doesnt+exists')
}|code-block|syntax|javascript|2717303|或者，您可以使用.has()|2717304|var+elem+=+$(".parent2");
if(elem.has(".child3")){
++++alert(elem.find(".child3").text());
}else{
++++alert('Element+doesnt+exists')
}|2717305|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/has/^0|5|7|0|0|8|6|8|6|0|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|Z|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|10|8|@$9|11|A|12|B|C]]|D|@$9|13|A|14|1|15]]|E|$]]|$1|M|3|N|5|H|7|16|8|@]|D|@]|E|$I|J]]|$1|O|3|-4|5|6|7|17|8|@]|D|@]|E|$]]]|P|$Q|$5|R|S|T|E|$U|V]]]]

<p>You can use <code>.length</code> property to check that element exists.</p>

<pre><code>var elem = $(".parent2").find(".child3");
if(elem.length){
    alert(elem.text());
}else{
    alert('Element doesnt exists')
}
</code></pre>

<p>Alternatively, You can use <a href="http://api.jquery.com/has/"><code>.has()</code></a></p>

<pre><code>var elem = $(".parent2");
if(elem.has(".child3")){
    alert(elem.find(".child3").text());
}else{
    alert('Element doesnt exists')
}
</code></pre>


blocks|key|2717321|text|无论何时在$()中包装选择器，它都会返回一个包含匹配元素数组的jQuery对象。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2717322|因此，您可以使用length属性来测试是否存在匹配项|2717323|var+$collection+=+$(".parent2").find(".child3").length;
if+($collection.length)....|code-block|syntax|javascript|2717324|您还可以使用其他方法，如is()|2717325|var+#collection+=+$(".parent2");
if($collection.children().is(".child3")+/*+returns+tru+if+there+are+matches|2717326|entityMap^0|5|3|0|8|6|0|0|C|4|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@$9|T|A|U|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|V|8|@$9|W|A|X|B|C]]|D|@]|E|$]]|$1|H|3|I|5|J|7|Y|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|Z|8|@$9|10|A|11|B|C]]|D|@]|E|$]]|$1|O|3|P|5|J|7|12|8|@]|D|@]|E|$K|L]]|$1|Q|3|-4|5|6|7|13|8|@]|D|@]|E|$]]]|R|$]]

<p>Whenever you wrap a selector in <code>$()</code> it will always return a jQuery object that contains the array of matching elements.</p>

<p>Therefore you can use the <code>length</code> property to test if there are matches</p>

<pre><code>var $collection = $(".parent2").find(".child3").length;
if ($collection.length)....
</code></pre>

<p>You can use other approaches also such as <code>is()</code></p>

<pre><code>var #collection = $(".parent2");
if($collection.children().is(".child3") /* returns tru if there are matches
</code></pre>


blocks|key|2717333|text|正如docs+for+find()所解释的，find()返回一个jQuery对象。它具有长度属性，可以检查该属性以确保查询成功。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2717334|if($(".parent1").find(".child3").length+>+0)+{
++++alert("parent1+child3");
}
if($(".parent2").find(".child3").length+>+0)+{
++++alert("parent2+child3");
}|code-block|syntax|javascript|2717335|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/find/^0|B|6|M|6|2|F|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@$9|T|A|U|B|C]|$9|V|A|W|B|C]]|D|@$9|X|A|Y|1|Z]]|E|$]]|$1|F|3|G|5|H|7|10|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|11|8|@]|D|@]|E|$]]]|L|$M|$5|N|O|P|E|$Q|R]]]]

<p>As the <a href="http://api.jquery.com/find/" rel="noreferrer">docs for <code>find()</code></a> explain, <code>find()</code> returns a jQuery object. It has a length propery which can be checked for a successful query.</p>

<pre><code>if($(".parent1").find(".child3").length &gt; 0) {
    alert("parent1 child3");
}
if($(".parent2").find(".child3").length &gt; 0) {
    alert("parent2 child3");
}
</code></pre>


blocks|key|2717280|text|​|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2717281|console.log(Boolean($(".parent1").find(".child3").length));
console.log(Boolean($(".parent2").find(".child3").length));
++++
console.log(!!$(".parent1").find(".child3").length);
console.log(!!$(".parent2").find(".child3").length);

console.log($(".parent1").find(".child3").length+>+0);
console.log($(".parent2").find(".child3").length+>+0);|code-block|syntax|javascript|2717282|<script+src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div+class="parent1">
++<div+class="child3"></div>
</div>

<div+class="parent2"></div>|2717283|2717284|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|M|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|I|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|K|$]]

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>console.log(Boolean($(".parent1").find(".child3").length));
console.log(Boolean($(".parent2").find(".child3").length));
    
console.log(!!$(".parent1").find(".child3").length);
console.log(!!$(".parent2").find(".child3").length);

console.log($(".parent1").find(".child3").length &gt; 0);
console.log($(".parent2").find(".child3").length &gt; 0);</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;div class="parent1"&gt;
  &lt;div class="child3"&gt;&lt;/div&gt;
&lt;/div&gt;

&lt;div class="parent2"&gt;&lt;/div&gt;</code></pre>
</div>
</div>
</p>


blocks|key|144835|text|.parent2没有元素.child3，|type|unstyled|depth|inlineStyleRanges|entityRanges|data|144836|alert($(".parent2").find(".child3").text());|code-block|syntax|javascript|144837|试试这个：|144838|alert($(".parent2").find(".child2").text());|144839|如果只想要最后一项，请尝试此操作|144840|​|144841|alert($(".parent1").find("[class%5E=child]:last").text());
alert($(".parent2").find("[class%5E=child]:last").text());|144842|<script+src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div+class="parent1">
++<div+class="child1">Child1</div>
++<div+class="child2">Child2</div>
++<div+class="child3">Child3</div>
</div>

<div+class="parent2">
++<div+class="child1">Child1</div>
++<div+class="child2">Child2</div>
</div>|144843|144844|entityMap^0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|V|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|W|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|X|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|Y|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|Z|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|10|8|@]|9|@]|A|$]]|$1|O|3|P|5|D|7|11|8|@]|9|@]|A|$E|F]]|$1|Q|3|R|5|D|7|12|8|@]|9|@]|A|$E|F]]|$1|S|3|N|5|6|7|13|8|@]|9|@]|A|$]]|$1|T|3|-4|5|6|7|14|8|@]|9|@]|A|$]]]|U|$]]

<p>There is no element .child3 for .parent2, </p>

<pre><code>alert($(".parent2").find(".child3").text());
</code></pre>

<p>Try this:</p>

<pre><code>alert($(".parent2").find(".child2").text());
</code></pre>

<p>Try this if you want only last item</p>

<p><div class="snippet" data-lang="js" data-hide="true">
<div class="snippet-code snippet-currently-hidden">
<pre class="snippet-code-js lang-js prettyprint-override"><code>alert($(".parent1").find("[class^=child]:last").text());
alert($(".parent2").find("[class^=child]:last").text());</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;div class="parent1"&gt;
  &lt;div class="child1"&gt;Child1&lt;/div&gt;
  &lt;div class="child2"&gt;Child2&lt;/div&gt;
  &lt;div class="child3"&gt;Child3&lt;/div&gt;
&lt;/div&gt;

&lt;div class="parent2"&gt;
  &lt;div class="child1"&gt;Child1&lt;/div&gt;
  &lt;div class="child2"&gt;Child2&lt;/div&gt;
&lt;/div&gt;</code></pre>
</div>
</div>
</p>


<p><strong>HTML Code</strong></p>
<pre><code>&lt;div class=&quot;parent1&quot;&gt;
    &lt;div class=&quot;child1&quot;&gt;Child1&lt;/div&gt;
    &lt;div class=&quot;child2&quot;&gt;Child2&lt;/div&gt;
    &lt;div class=&quot;child3&quot;&gt;Child3&lt;/div&gt;
&lt;/div&gt;

&lt;div class=&quot;parent2&quot;&gt;
    &lt;div class=&quot;child1&quot;&gt;Child1&lt;/div&gt;
    &lt;div class=&quot;child2&quot;&gt;Child2&lt;/div&gt;
&lt;/div&gt;
</code></pre>
<p><strong>jQuery Code</strong></p>
<pre><code>alert($(&quot;.parent1&quot;).find(&quot;.child3&quot;).text());
alert($(&quot;.parent2&quot;).find(&quot;.child3&quot;).text());
</code></pre>
<p>My question is how to check <code>find</code> function return true or false?</p>
<p>In above code it return blank value, where <code>parent1</code> class have <code>child3</code> class where <code>parent2</code> class do not have <code>child3</code> class.</p>
<p><strong><a href="http://jsfiddle.net/q3bx11qe/2/" rel="noreferrer">JS Fiddle</a></strong></p>


How to check jQuery find return true or false?

jQuery

HTML代码<div class="parent1">    <div class="child1">Child1</div>    <div class="child2">Child2</div>    <div class="child3">Child3</div></div><div class="parent2">    <div class="child1">Child1</div>  

问如何检查jQuery查找返回true或false？
EN

回答 6

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何检查jQuery查找返回true或false？EN

回答 6

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何检查jQuery查找返回true或false？
EN