Возможный дубликат:
Проверка того, что элемент html пуст с jQuery
У меня есть пустой div, подобный этому:
<div id="cartContent"></div>
Мне нужно проверить, не пуст ли он. Если он пуст, ему нужно вернуть true, а затем добавить некоторые элементы
. Если он не возвращает false и выполняет какую-либо другую функцию. Какой лучший способ проверить, есть ли какие-либо элементы
в div?
Спасибо
Вы можете использовать .is().
if( $('#leftmenu').is(':empty') ) {
Или вы можете просто проверить свойство length, чтобы узнать, был ли найден найденный файл:
if( $('#leftmenu:empty').length ) {
Вы можете использовать $.trim() для удаления пробелов (если это необходимо) и проверить длину содержимого.
if( !$.trim( $('#leftmenu').html() ).length ) {
Использование простого javascript
var isEmpty = document.getElementById('cartContent').innerHTML === "";
И если вы используете jquery, это можно сделать, например
var isEmpty = $("#cartContent").html() === "";
Как уже отмечалось, вы можете использовать :empty в jQuery следующим образом:
$('#cartContent:empty').remove();
Он удалит div #cartContent, если он пуст.
Но это и другие методы, которые люди предлагают здесь, могут не делать то, что вы хотите, потому что, если у них есть какие-либо текстовые узлы, содержащие пробелы, они не считаются пустыми. Итак, это не пусто:
<div> </div>
хотя вы можете считать его пустым.
У меня была эта проблема некоторое время назад, и я написал этот крошечный плагин jQuery - просто добавьте его в свой код:
jQuery.expr[':'].space = function(elem) {
var $elem = jQuery(elem);
return !$elem.children().length && !$elem.text().match(/\S/);
}
и теперь вы можете использовать
$('#cartContent:space').remove();
который удалит div, если он пуст или содержит только пробелы. Конечно, вы можете не только удалить его, но и делать что угодно, например
$('#cartContent:space').append('<p>It is empty</p>');
и вы можете использовать :not следующим образом:
$('#cartContent:not(:space)').append('<p>It is not empty</p>');
Я вышел с этим тестом, который надежно сделал то, что я хотел, и вы можете вытащить его из плагина, чтобы использовать его как автономный тест:
Этот объект будет работать для объектов jQuery:
function testEmpty($elem) {
return !$elem.children().length && !$elem.text().match(/\S/);
}
Этот будет работать для узлов DOM:
function testEmpty(elem) {
var $elem = jQuery(elem);
return !$elem.children().length && !$elem.text().match(/\S/);
}
Это лучше, чем использование .trim, потому что вышеприведенный код сначала проверяет, имеет ли тестируемый элемент какие-либо дочерние элементы, и если он пытается найти первый символ без пробелов, а затем останавливается, без необходимости читать или мутировать строка, если у нее есть даже один символ, который не является пробелом.
Надеюсь, что это поможет.
Вы можете использовать функцию is
if( $('#cartContent').is(':empty') ) { }
или используйте длину
if( $('#cartContent:empty').length ) { }
var empty = $("#cartContent").html().trim().length == 0;
if ($("#cartContent").children().length == 0)
{
// no child
}