JavaScript判断DIV内容是否为空的方法


Posted in Javascript onJanuary 29, 2016

1、问题背景

判断div内部是否为空,如果为空,给出无数据提示;否则显示正常页面

2、实现效果图如下所示:

JavaScript判断DIV内容是否为空的方法

3、设计源码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>如何判断DIV中的内容为空</title> 
<script type="text/javascript" src="jquery-2.2.0.js"></script> 
<script type="text/javascript"> 
$(function(){ 
$("#content").append("<div id='dv'>您好!</div>"); 
$("#btn").click(function(){ 
var content = $("#content").html(); 
var noContent = $("#no_content").html(); 
if(content == null || content.length == 0) 
{ 
alert("content:"+conten); 
} 
if(noContent == null || noContent.length == 0) 
{ 
alert("noContent:"+noContent); 
} 
}); 
}); 
</script> 
</head> 
<body> 
<div id="content"></div> 
<div id="no_content"></div> 
<input type="button" id="btn" value="判读DIV为空"/> 
</body> 
</html>

以上所述是小编给大家介绍JavaScript判断DIV内容是否为空的方法,希望对大家有所帮助。

Javascript 相关文章推荐
JavaScript 申明函数的三种方法 每个函数就是一个对象(一)
Dec 04 Javascript
基于jquery的合并table相同单元格的插件(精简版)
Apr 05 Javascript
解析javascript 浏览器关闭事件
Jul 08 Javascript
JS中attr和prop属性的区别以及优先选择示例介绍
Jun 30 Javascript
分享10个原生JavaScript技巧
Apr 20 Javascript
jQuery多级手风琴菜单实例讲解
Oct 22 Javascript
jquery自定义表单验证插件
Oct 12 Javascript
bootstrap suggest搜索建议插件使用详解
Mar 25 Javascript
JavaScript事件委托原理与用法实例分析
Jun 07 Javascript
详解bootstrap-fileinput文件上传控件的亲身实践
Mar 21 Javascript
vue实例的选项总结
Jun 09 Javascript
详解Vue中的自定义指令
Dec 07 Vue.js
基于javascript实现listbox左右移动
Jan 29 #Javascript
关于获取DIV内部内容报错的原因分析及解决办法
Jan 29 #Javascript
jQuery模拟360浏览器切屏效果幻灯片(附demo源码下载)
Jan 29 #Javascript
js实现滚动条滚动到某个位置便自动定位某个tr
Jan 20 #Javascript
JavaScript中的this,call,apply使用及区别详解
Jan 29 #Javascript
javascript实现tab响应式切换特效
Jan 29 #Javascript
JavaScript SweetAlert插件实现超酷消息警告框
Jan 28 #Javascript
You might like
用Zend Encode编写开发PHP程序
2010/02/21 PHP
解析posix与perl标准的正则表达式区别
2013/06/17 PHP
PHP、Nginx、Apache中禁止网页被iframe引用的方法
2020/10/01 PHP
php的XML文件解释类应用实例
2014/09/22 PHP
PHP中使用imagick生成PSD文件缩略图教程
2015/01/26 PHP
php查询相似度最高的字符串的方法
2015/03/12 PHP
php生成酷炫的四个字符验证码
2016/04/22 PHP
PHP中ltrim()函数的用法与实例讲解
2019/03/28 PHP
Thinkphp5框架实现图片、音频和视频文件的上传功能详解
2019/08/27 PHP
php图像生成函数之间的区别分析
2012/12/06 Javascript
借助script进行Http跨域请求:JSONP实现原理及代码
2013/03/19 Javascript
JavaScript中instanceof运算符的用法总结
2013/11/19 Javascript
GitHub上一些实用的JavaScript的文件压缩解压缩库推荐
2016/03/13 Javascript
基于angularjs实现图片放大镜效果
2016/08/31 Javascript
Bootstrap基本模板的使用和理解1
2016/12/14 Javascript
用nodeJS搭建本地文件服务器的几种方法小结
2017/03/16 NodeJs
javascript如何用递归写一个简单的树形结构示例
2017/09/06 Javascript
基于jQuery的$.getScript方法去加载javaScript文档解析
2017/11/08 jQuery
详解vue的数据劫持以及操作数组的坑
2019/04/18 Javascript
vue实现树形结构样式和功能的实例代码
2019/10/15 Javascript
解决vue admin element noCache设置无效的问题
2019/11/12 Javascript
JS数组进阶示例【数组的几种函数用法】
2020/01/16 Javascript
Python实现备份文件实例
2014/09/16 Python
python实现录音小程序
2020/10/26 Python
详解Python3 pandas.merge用法
2019/09/05 Python
pycharm运行程序时看不到任何结果显示的解决
2020/02/21 Python
python使用turtle库绘制奥运五环
2020/02/24 Python
五分钟带你搞懂python 迭代器与生成器
2020/08/30 Python
使用scrapy ImagesPipeline爬取图片资源的示例代码
2020/09/28 Python
Python xmltodict模块安装及代码实例
2020/10/05 Python
设计师家具购买和委托在线市场:Viyet
2016/11/16 全球购物
德国最大的网上鞋店之一:Schuhe24.de
2017/06/10 全球购物
彪马英国官网:PUMA英国
2019/02/11 全球购物
课外活动总结范文
2014/07/09 职场文书
房屋出租委托书格式
2014/09/23 职场文书
详解Redis瘦身指南
2021/05/26 Redis