[原创]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加密密码到cookie的实现代码
Apr 18 jQuery
利用jquery去掉时光轴头尾部线条的方法实例
Jun 16 jQuery
各种选择框jQuery的选中方法(实例讲解)
Jun 27 jQuery
jquery easyui如何实现格式化列
Jul 30 jQuery
jQuery实现对网页节点的增删改查功能示例
Sep 18 jQuery
CSS3结合jQuery实现动画效果及回调函数的实例
Dec 27 jQuery
使用jquery Ajax实现上传附件功能
Oct 23 jQuery
jQuery使用bind动态绑定事件无效的处理方法
Dec 11 jQuery
jQuery实现验证用户登录
Dec 10 jQuery
jQuery实现移动端笔触canvas电子签名
May 21 jQuery
jQuery 动态粒子效果示例代码
Jul 07 jQuery
jQuery 实现DOM元素拖拽交换位置的实例代码
Jul 14 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编程最快明白》第八讲:php启发和小结
2010/11/01 PHP
php根据数据id自动生成编号的实现方法
2016/10/16 PHP
PHP递归实现快速排序的方法示例
2017/12/18 PHP
用 javascript 实现的点击复制代码
2007/03/24 Javascript
面向对象的Javascript之二(接口实现介绍)
2012/01/27 Javascript
比例尺、缩略图、平移缩放之百度地图添加控件方法
2015/08/03 Javascript
jfinal与bootstrap的登录跳转实战演习
2015/09/22 Javascript
jquery实现树形菜单完整代码
2015/12/29 Javascript
JQuery fileupload插件实现文件上传功能
2016/03/18 Javascript
很实用的js选项卡切换效果
2016/08/12 Javascript
Jquery给当前页或者跳转后页面的导航栏添加选中后样式的实例
2016/12/08 Javascript
jQuery实现select模糊查询(反射机制)
2017/01/14 Javascript
javascript 开发之百度地图使用到的js函数整理
2017/05/19 Javascript
vue-router配合ElementUI实现导航的实例
2018/02/11 Javascript
记录一篇关于redux-saga的基本使用过程
2018/08/18 Javascript
6行代码实现微信小程序页面返回顶部效果
2018/12/28 Javascript
详解微信小程序开发聊天室—实时聊天,支持图片预览
2019/05/20 Javascript
jquery实现轮播图特效
2020/04/12 jQuery
vue-admin-template配置快捷导航的代码(标签导航栏)
2020/09/04 Javascript
vue 使用lodash实现对象数组深拷贝操作
2020/09/10 Javascript
vant-ui框架的一个bug(解决切换后onload不触发)
2020/11/11 Javascript
[47:53]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#2COL VS Spirit
2016/03/02 DOTA
Python中super关键字用法实例分析
2015/05/28 Python
Python和Go语言的区别总结
2019/02/20 Python
对pyqt5之menu和action的使用详解
2019/06/20 Python
python字典改变value值方法总结
2019/06/21 Python
django框架两个使用模板实例
2019/12/11 Python
什么是CSS3 HSLA色彩模式?HSLA模拟渐变色条
2016/04/26 HTML / CSS
linux系统都有哪些运行级别
2016/03/26 面试题
汽车销售顾问求职自荐信
2014/01/01 职场文书
学生安全教育材料
2014/02/14 职场文书
领导党性分析材料
2014/02/15 职场文书
趵突泉导游词
2015/02/03 职场文书
学生退学证明
2015/06/23 职场文书
Hive日期格式转换方法总结
2022/06/25 数据库
MySQL性能指标TPS+QPS+IOPS压测
2022/08/05 MySQL