jquery判断div是否含有内容

原创

mob64ca12f55920 2023-11-23 08:08:45 ©著作权

文章标签 jQuery javascript 代码实现 文章分类 jQuery 前端开发

©著作权归作者所有：来自51CTO博客作者mob64ca12f55920的原创作品，请联系作者获取转载授权，否则将追究法律责任

判断div是否含有内容的实现方法

流程图

flowchart TD;
    A[开始] --> B[选择div元素];
    B --> C[判断div内容是否为空];
    C --> |是| D[执行逻辑1];
    C --> |否| E[执行逻辑2];
    D --> F[结束];
    E --> F;
    F --> G[输出结果];

步骤及代码实现

步骤	操作	代码	注释
1	选择div元素	`let divElement = document.querySelector('div');`	使用querySelector方法选择页面中的第一个div元素，并将其赋值给divElement变量
2	判断div内容是否为空	`if (divElement.innerText === '') {`<br>`// div内容为空的逻辑`<br>`} else {`<br>`// div内容不为空的逻辑`<br>`}`	使用innerText属性获取div元素的文本内容，并与空字符串进行比较，判断div内容是否为空
3	执行逻辑1	`console.log('div内容为空');`	当div内容为空时，执行逻辑1，这里只是简单地输出一条信息
4	执行逻辑2	`console.log('div内容不为空');`	当div内容不为空时，执行逻辑2，这里只是简单地输出一条信息
5	输出结果	`console.log('判断完成');`	输出判断完成的信息

代码实现

// 选择div元素
let divElement = document.querySelector('div');

// 判断div内容是否为空
if (divElement.innerText === '') {
    // div内容为空的逻辑
    console.log('div内容为空');
} else {
    // div内容不为空的逻辑
    console.log('div内容不为空');
}

// 输出结果
console.log('判断完成');

以上代码是基于原生JavaScript的实现方法。如果你正在使用jQuery，也可以使用以下代码：

// 选择div元素
let divElement = $('div');

// 判断div内容是否为空
if (divElement.text() === '') {
    // div内容为空的逻辑
    console.log('div内容为空');
} else {
    // div内容不为空的逻辑
    console.log('div内容不为空');
}

// 输出结果
console.log('判断完成');

注释：