Как получить элементы, которые не имеют детей, но могут иметь текст?

пустой селектор говорит, что: Соответствует всем элементам, у которых нет детей (включая текстовые узлы).
Находит все элементы, которые empty - у них нет дочерних элементов или текста.

Я хочу, чтобы получить элементы, которые не имеют детей, но могут иметь текст внутри., Как?



UPDATE:
Пример:
Я хочу выбрать эти элементы, у которых нет детей, но может иметь текст с синтаксисом, подобным этому:

$('div:empty, a:empty, span, p:empty, td:empty, img, input').mousemove(myMouseOverHandler);

Ответы

Ответ 1

Получить любой элемент, который не имеет другого элемента:

$('*:not(:has(*))');

Ответ 2

Если элемент имеет только текст, children() будет иметь длину 0:

<div id="test1">
Hello World
</div>

<div id="test2">
<b>Hey there</b>
</div>

<script>
alert($("#test1").children().length); // alerts 0
alert($("#test2").children().length); // alerts 1 (the bold tag)
</script>

EDIT. В ответ на ваше редактирование jQuery достаточно велико, чтобы вы могли создавать собственные фильтры:

$.expr[':'].emptyOrText = function(e) {  
    return $(e).children().length == 0;
};

Итак, используя вышеперечисленное выше HTML, вы можете сделать это:

$('div:emptyOrText'); // will select #test1

Ответ 3

Я сделал чистую функцию JavaScript для тех, кто не хочет использовать jQuery.

const getElementsWithNoChildren = (target) => {
    let candidates;

    if (target && typeof target.querySelectorAll === 'function') {
        candidates = target.querySelectorAll('*');
    }
    else if (target && typeof target.length === 'number') {
        candidates = target;
    }
    else {
        candidates = document.querySelectorAll('*');
    }

    return Array.from(candidates).filter((elem) => {
        return elem.children.length === 0;
    });
};