[原创]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-data的三种用法
Apr 18 jQuery
jQuery实现简单的滑动导航代码(移动端)
May 22 jQuery
jQuery ajax动态生成table功能示例
Jun 14 jQuery
使用jquery的jsonp如何发起跨域请求及其原理详解
Aug 17 jQuery
jQuery 1.9版本以上的浏览器判断方法代码分享
Aug 28 jQuery
jquery实现用户登陆界面(示例讲解)
Sep 06 jQuery
vue-cli webpack 引入jquery的方法
Jan 10 jQuery
jQuery实现动画、消失、显现、渐出、渐入效果示例
Sep 06 jQuery
jQuery - AJAX load() 实例用法详解
Aug 27 jQuery
jQuery鼠标滑过横向时间轴样式(代码详解)
Nov 01 jQuery
jQuery实现颜色打字机的完整代码
Mar 19 jQuery
jQuery实现tab栏切换效果
Dec 22 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与mysql建立连接并执行SQL语句的代码
2011/07/04 PHP
php获取字段名示例分享
2014/03/03 PHP
PHP中类与对象功能、用法实例解读
2020/03/27 PHP
js生成随机数的方法实例
2015/10/16 Javascript
js简单实现调整网页字体大小的方法
2016/07/23 Javascript
AngularJS 服务详细讲解及示例代码
2016/08/17 Javascript
AngularJS变量及过滤器Filter用法分析
2016/11/22 Javascript
防止重复发送 Ajax 请求
2017/02/15 Javascript
vue基于Vue2.0和高德地图的地图组件实例
2017/04/28 Javascript
Angular2.js实现表单验证详解
2017/06/23 Javascript
Vue from-validate 表单验证的示例代码
2017/09/26 Javascript
node事件循环和process模块实例分析
2020/02/14 Javascript
javascript实现画板功能
2020/04/12 Javascript
[01:01:24]LGD vs Fnatic 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
跟老齐学Python之变量和参数
2014/10/10 Python
浅析PEP572: 海象运算符
2019/10/15 Python
解决Tensorflow 使用时cpu编译不支持警告的问题
2020/02/03 Python
利用Python计算KS的实例详解
2020/03/03 Python
Python面向对象程序设计之继承、多态原理与用法详解
2020/03/23 Python
Python .py生成.pyd文件并打包.exe 的注意事项说明
2021/03/04 Python
HTML5 LocalStorage 本地存储详细概括(多图)
2017/08/18 HTML / CSS
HTML5仿微信聊天界面、微信朋友圈实例代码
2018/01/29 HTML / CSS
携程旅行网:中国领先的在线旅行服务公司
2017/02/17 全球购物
玉兰油美国官网:OLAY美国
2018/10/25 全球购物
英国专业美容产品在线:Mylee(从指甲到脱毛)
2020/07/06 全球购物
中海讯通笔试题
2015/09/15 面试题
Python如何定义一个函数
2015/09/01 面试题
俄语翻译实习生的自我评价分享
2013/11/06 职场文书
应用化学专业职业生涯规划书
2013/12/31 职场文书
大学生活动总结怎么写
2014/04/29 职场文书
雏鹰争章活动总结
2014/05/09 职场文书
践行三严三实心得体会(2016推荐篇)
2016/01/06 职场文书
使用PDF.js渲染canvas实现预览pdf的效果示例
2021/04/17 Javascript
SQL注入的实现以及防范示例详解
2021/06/02 MySQL
详解Spring Security如何在权限中使用通配符
2022/06/28 Java/Android
Win10服务全部禁用了怎么启动?Win10服务全部禁用解决方法
2022/09/23 数码科技