zoukankan      html  css  js  c++  java
  • jquery选择器的一些处理

    本文不讨论用jquery选择器具体怎么选择页面元素,而讨论选择元素后后的一些处理

    jquery的选择器选择元素的时候,即使没有选择到指定的对象,页面并不会报错,例子:

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    </head>
    <body>
    	<div>
    	</div>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <script>
    	$("#a").css("color","red");
    </script>
    </body>
    </html>
    

      

    这个例子中,页面上没有id=”a”的元素,对$(”#a”)对象操作,控制台并不会报任何错误。容错性好,这样的好处是所有的对象操作可以写在一个js文件里而不报错。坏处是调试不太方便,选择器里写错了不容易发现,比较坑。

    可以看出,id=”a”的元素不存在时,发回一个n.fn.init对象,里面包含两项。

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    </head>
    <body>
    	<div>
    	</div>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <script>
    	console.log($("#a"));//页面并没有id="a"的元素,控制台打印如下:n.fn.init {context: document, selector: "#a"}
    </script>
    </body>
    </html>
    

      

    选择器有没有选中元素,不能用if($(“select”))来判断了,反面例子

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    </head>
    <body>
    	<div>
    	</div>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <script>
    if($("#a"))
    {
    	alert("不空")//弹出这个,不是我们想要的!!!
    }else
    {
    	alert("空");
    }
    </script>
    </body>
    </html>
    

      

    可以看出,这样得到的结果是错的。有没有选择到元素,应该通过jquery的length属性的值,即元素的长度来,来判断,这个值为零,没有选中元素:

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    </head>
    <body>
    	<div>
    	</div>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <script>
    if($("#a").length)
    {
    	alert("不空")
    }else
    {
    	alert("空");//弹出这个,这是我们想要的结果
    }
    </script>
    </body>
    </html>
    

      

    总结:判断选择器有没有选到元素,要用if($(“select”).length)判断

  • 相关阅读:
    easyui_1
    JSONOBJECT
    基础回顾—list遍历4种
    <input type=file>上传唯一控件
    window.open
    poi--导入
    java字符串的替换
    一、IIS搭建前端静态模板_资源加载问题
    一、ASP.NET Iframework_SignalR集线器类(v2)
    一、ASP.NET Iframework_SignalR永久连接类(v2)
  • 原文地址:https://www.cnblogs.com/xiaochongchong/p/5497343.html
Copyright © 2011-2022 走看看