[原创]jquery判断元素内容是否为空的方法


Posted in jQuery onMay 04, 2018

用jquery获取元素内容需要分两个情况:

input 用val();

var value = $('#test').val();

是否为空的判断方法:

if(value.length == 0){} 如果value为空执行的操作

if(value!=''){} 如果value不为空执行的操作

jQuery验证文本框内容不为空

通过$.fn 扩展jQuery方法

/**
 * 校验文本是否为空
 * tips:提示信息
 * 使用方法:$("#id").validate("提示文本");
 * @itmyhome
 */
$.fn.validate = function(tips){

  if($(this).val() == "" || $.trim($(this).val()).length == 0){
    alert(tips + "不能为空!");
    throw SyntaxError(); //如果验证不通过,则不执行后面
  }
}

html元素用html();

var value = $('#test').html();

是否为空的判断方法:

if(value.length == 0){

 也可以通过判断是说有没有子节点?对于html获取的方法可用

$('#list').children().length === 0 。

方法一

<script type="text/javascript" src="http://m.3water.com/skin/mobile/js/jquery.min.js"></script>
<div><ul id="thelist2">
<li><a href="https://m.3water.com/game/140209.html"><img src="//img.jbzj.com/do/uploads/litimg/140228/100331632c.jpg">天天飞车航哥破解版</a><em class="xj star5"></em></li>
<li><a href="https://m.3water.com/game/143515.html"><img src="//img.jbzj.com/do/uploads/litimg/140314/0944332514F.jpg"> 节奏大师全P破解版</a><em class="xj star6"></em></li>
<li><a href="https://m.3water.com/game/207971.html"><img src="//img.jbzj.com/do/uploads/litimg/140821/11594R51423.gif">海岛奇兵国服内购破解版</a><em class="xj star5"></em></li>
<li><a href="https://m.3water.com/game/144709.html"><img src="//img.jbzj.com/do/uploads/litimg/140318/161504236013.gif">天天炫斗破解版</a><em class="xj star5"></em></li>
<li><a href="https://m.3water.com/game/80896.html"><img src="//img.jbzj.com/do/uploads/litimg/130503/1J21Va46.jpg">完美女友完整版</a><em class="xj star5"></em></li>
</ul>
<div><ul id="thelist3"></ul>
<script>
alert($('#thelist2').children().length)
alert($('#thelist3').children().length)
$thelist3 = $('#thelist3');
if($thelist3.children().length==0){
//插入广告
}
/*
thel3con = $('#thelist3').html();
alert(thel3con.length);
if(thel3con=""){
alert("空");

}else{
alert("非空");
}
*/
</script>

方法二、

String.prototype.isEmpty = function () {
 var s1 = this.replace(/[\r\n]/g, '').replace(/[ ]/g, ''),
   s2 = (s1 == '') ? true : false;
 return s2;
};
$list.html().isEmpty();

if( $("#list").html() === "" ){} 用三个等号更符合

jQuery 相关文章推荐
jQuery插件select2利用ajax高效查询大数据列表(可搜索、可分页)
May 19 jQuery
jQuery复合事件结合toggle()方法的用法示例
Jun 10 jQuery
jquery获取链接地址和跳转详解(推荐)
Aug 15 jQuery
jQuery结合jQuery.cookie.js插件实现换肤功能示例
Oct 14 jQuery
将jquery.qqFace.js表情转换成微信的字符码
Dec 01 jQuery
浅谈jquery fullpage 插件增加头部和版权的方法
Mar 20 jQuery
jQuery事件多次绑定与解绑问题实例分析
Feb 19 jQuery
jQuery选择器之基本过滤选择器用法实例分析
Feb 19 jQuery
JS/jQuery实现获取时间的方法及常用类完整示例
Mar 07 jQuery
jQuery操作选中select下拉框的值代码实例
Feb 07 jQuery
jQuery中event.target和this的区别详解
Aug 13 jQuery
原生jQuery实现只显示年份下拉框
Dec 24 jQuery
jQuery实现每隔一段时间自动更换样式的方法分析
May 03 #jQuery
基于jquery实现左右上下移动效果
May 02 #jQuery
jQuery实现遍历XML节点和属性的方法示例
Apr 29 #jQuery
jQuery实现的电子时钟效果完整示例
Apr 28 #jQuery
vue+jquery+lodash实现滑动时顶部悬浮固定效果
Apr 28 #jQuery
jQuery实现鼠标滑过商品小图片上显示对应大图片功能【测试可用】
Apr 27 #jQuery
jQuery实现DIV响应鼠标滑过由下向上展开效果示例【测试可用】
Apr 26 #jQuery
You might like
php跨域cookie共享使用方法
2014/02/20 PHP
php+redis实现多台服务器内网存储session并读取示例
2017/01/12 PHP
Javascript 代码也可以变得优美的实现方法
2009/06/22 Javascript
基于jQuery的弹出消息插件 DivAlert之旅(一)
2010/04/01 Javascript
JavaScript Memoization 让函数也有记忆功能
2011/10/27 Javascript
jQuery 在光标定位的地方插入文字的插件
2012/05/10 Javascript
Ajax提交与传统表单提交的区别说明
2014/02/07 Javascript
jquery实现邮箱自动补全功能示例分享
2014/02/17 Javascript
jQuery的text()方法用法分析
2014/12/20 Javascript
jQuery实现可用于博客的动态滑动菜单
2015/03/09 Javascript
jQuery.Highcharts.js绘制柱状图饼状图曲线图
2015/03/14 Javascript
12行javascript代码绘制一个八卦图
2015/04/02 Javascript
手机端页面rem宽度自适应脚本
2015/05/20 Javascript
快速学习jQuery插件 Cookie插件使用方法
2015/12/01 Javascript
EasyUI折叠表格层次显示detailview详解及实例
2016/12/28 Javascript
vuejs2.0实现一个简单的分页示例
2017/02/22 Javascript
Angular 4.x 路由快速入门学习
2017/05/03 Javascript
解决angular双向绑定无效果,ng-model不能正常显示的问题
2018/10/02 Javascript
[03:20]2015国际邀请赛全明星表演赛
2015/08/08 DOTA
python实现连接mongodb的方法
2015/05/08 Python
python 捕获shell脚本的输出结果实例
2017/01/04 Python
关于python列表增加元素的三种操作方法
2018/08/22 Python
pandas数据筛选和csv操作的实现方法
2019/07/02 Python
Win10下python 2.7与python 3.7双环境安装教程图解
2019/10/12 Python
Python3.9.1中使用match方法详解
2021/02/08 Python
Melissa香港官网:MDreams
2016/07/01 全球购物
Eyeko美国:屡获殊荣的睫毛膏、眼线笔和眉妆
2018/07/05 全球购物
描述一下JVM加载class文件的原理机制
2013/12/08 面试题
JAVA软件工程师测试题
2014/07/25 面试题
4s店机修工岗位职责
2013/12/20 职场文书
运动会领导邀请函
2014/02/05 职场文书
社团活动总结报告
2014/06/27 职场文书
论文答谢词
2015/01/20 职场文书
给校长的建议书作文300字
2015/09/14 职场文书
合同补充协议书
2016/03/24 职场文书
pytorch中的torch.nn.Conv2d()函数图文详解
2022/02/28 Python