Использование jQuery, чтобы узнать, есть ли у div дочерний элемент с определенным классом

115

У меня есть div, #popupкоторый динамически заполняется несколькими абзацами с классом .filled-text. Я пытаюсь заставить jQuery сказать мне, #popupесть ли в нем один из этих абзацев.

У меня есть такой код:

$("#text-field").keydown(function(event) {
    if($('#popup').has('p.filled-text')) {
        console.log("Found");
     }
});

Какие-либо предложения?

javascript jquery Samsquanch
источник
1
Вы ищете только ребенка или любого потомка (ребенка, внука, правнука и т. Д.). В настоящее время в заголовке вопроса написано «ребенок», но ответы, похоже, говорят о произвольных потомках.
hippietrail
В то время я думаю, что специально искал ребенка, но это трудно вспомнить наверняка, так как этому вопросу почти 4 года. В любом случае, вопросы и ответы охватывают как детей, так и потомков, и есть также ответы, которые касаются конкретно детей, а не потомков, поэтому я не уверен, что вы пытаетесь понять.
Samsquanch
О, просто при использовании поисковой системы для поиска вопроса конкретно о поиске элемента с дочерним элементом, соответствующим селектору, это тот, который он находит, поэтому я бы изменил заголовок вопроса, если бы он был неточным, чтобы помочь другим людям найти правильный вопрос в будущем.
hippietrail

Ответы:

198

Вы можете использовать функцию поиска :

if($('#popup').find('p.filled-text').length !== 0)
   // Do Stuff
Tejs
источник
7
Это действительно сработало так, как мне нужно, но для справки if($('#popup').has('p.filled-text').length != 0) {тоже работает.
Samsquanch
9
Нет необходимости проверять 0. 0 в js - это ложь. developer.mozilla.org/en-US/docs/Glossary/Falsy
РАВИ
7

Используйте детскую функцию jQuery.

$("#text-field").keydown(function(event) {
    if($('#popup').children('p.filled-text').length > 0) {
        console.log("Found");
     }
});

$.children('').length вернет количество дочерних элементов, соответствующих селектору.

Кристофер Рамирес
источник
1
.size()возвращает то же, что и .lengthсвойство, но медленнее, поэтому вам следует заменить это.
Йоханнес Клаус
Спасибо, Джоннес, что указал мне на это! Я этого не знал. Answare обновлен!
Кристофер Рамирес
Пожалуйста, но ошибка все равно есть. Это .lengthне так.length()
Йоханнес Клаус
: PI думал, что это функция, как и большинство интерфейсов jQuery. Я думаю, что это какая-то непоследовательность. Но что ж, answare снова обновился: P Спасибо, Йоханнес.
Кристофер Рамирес
.lengthСвойство не является частью библиотеки JQuery, это просто родной JavaScript. Но да, иногда это может сбивать с толку.
Йоханнес Клаус
4

Простой способ

if ($('#text-field > p.filled-text').length != 0)
Хитеш Модха
источник
2
Метод .size () функционально эквивалентен свойству .length; тем не менее, свойство .length является предпочтительным, потому что оно не имеет накладных расходов, связанных с вызовом функции.
Hitesh Modha
1

Если это прямой дочерний элемент, вы можете сделать, как показано ниже, если он может быть вложен глубже, удалите>

$("#text-field").keydown(function(event) {
    if($('#popup>p.filled-text').length !== 0) {
        console.log("Found");
     }
});
Руна FS
источник