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 相关文章推荐
JQuery 网站换肤功能实现代码
Nov 02 Javascript
JavaScript 弹出窗体点击按钮返回选择数据的实现
Apr 01 Javascript
jquery对象和javascript对象即DOM对象相互转换
Aug 07 Javascript
javascript实现图片自动和可控的轮播切换特效
Apr 13 Javascript
JS模式之单例模式基本用法
Jun 30 Javascript
Angularjs中的事件广播 —全面解析$broadcast,$emit,$on
May 17 Javascript
Vue 2.X的状态管理vuex记录详解
Mar 23 Javascript
vue组件中iview的modal组件爬坑问题之modal的显示与否应该是使用v-show
Apr 12 Javascript
微信小程序文章详情页跳转案例详解
Jul 09 Javascript
完美解决vue 中多个echarts图表自适应的问题
Jul 19 Javascript
解决vue项目 build之后资源文件找不到的问题
Sep 12 Javascript
vuex中遇到的坑,vuex数据改变,组件中页面不渲染操作
Nov 16 Javascript
基于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
浅谈PHP的数据库接口和技术
2016/12/09 PHP
Laravel数据库读写分离配置的方法
2019/10/13 PHP
JavaScript对象之间的转换 jQuery对象和原声DOM
2011/03/07 Javascript
Jquery插件之打造自定义的select标签
2011/11/30 Javascript
js取滚动条的尺寸的函数代码
2011/11/30 Javascript
15条JavaScript最佳实践小结
2013/08/09 Javascript
jQuery+ajax实现鼠标单击修改内容的方法
2014/06/27 Javascript
兼容Firefox的Javascript XSLT 处理XML文件
2014/12/31 Javascript
js判断浏览器版本以及浏览器内核的方法
2015/01/20 Javascript
JavaScript DOM 学习总结(五)
2015/11/24 Javascript
学习JavaScript设计模式(策略模式)
2015/11/26 Javascript
JavaScript+html5 canvas绘制的小人效果
2016/01/27 Javascript
Extjs 点击复选框在表格中增加相关信息行
2016/07/12 Javascript
js实现html table 行,列锁定的简单实例
2016/10/13 Javascript
NodeJS实现微信公众号关注后自动回复功能
2017/05/31 NodeJs
浅谈vuejs实现数据驱动视图原理
2018/02/23 Javascript
vue 纯js监听滚动条到底部的实例讲解
2018/09/03 Javascript
JavaScript进制转换实现方法解析
2020/01/18 Javascript
Python生成器以及应用实例解析
2018/02/08 Python
使用PyInstaller将python转成可执行文件exe笔记
2018/05/26 Python
Python字符串、整数、和浮点型数相互转换实例
2018/08/04 Python
Python操作json的方法实例分析
2018/12/06 Python
对python csv模块配置分隔符和引用符详解
2018/12/12 Python
Python中super函数用法实例分析
2019/03/18 Python
JupyterNotebook 输出窗口的显示效果调整实现
2020/09/22 Python
css3选择器基本介绍
2014/12/15 HTML / CSS
全球知名旅游社区巴西站点:TripAdvisor巴西
2016/07/21 全球购物
斯凯奇新西兰官网:SKECHERS新西兰
2018/02/22 全球购物
联想阿根廷官方网站:Lenovo Argentina
2019/10/14 全球购物
大学辅导员事迹材料
2014/02/05 职场文书
市场推广策划方案
2014/06/02 职场文书
学雷锋标兵事迹材料
2014/08/18 职场文书
党性锻炼的心得体会
2014/09/03 职场文书
聘任书的格式及模板
2019/10/28 职场文书
MySQL 1130异常,无法远程登录解决方案详解
2021/08/23 MySQL
Win11如何修改dns?Win11修改dns图文教程
2022/01/18 数码科技