关于选择器:hidden的说明，在jquery说明文档中是这样说的：匹配所有不可见元素，或者type为hidden的元素。而[type=hidden]是查找所有type属性等于hidden的元素。两者是有相同之处和不同之处的。:hidden匹配所有不可见元素，或者type为hidden的元素，所有样式display等于none的元素和子元素以及type="hidden"的表单元素都在查找的结果中，而[type=hidden]则只查找type属性为hidden的元素。

所以，input:hidden是查找不可见容器中的input元素，包括，textbox,radio,checkbox,button等和type="hidden"的表单元素。input[type=hidden]仅仅查找type="hidden"的表单元素。如以下例子：

<!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=gb2312" />

<title>jquery Demo</title>

<script type="text/javascript" src="jquery-1.7.1.min.js"></script>

<script type="text/javascript">

function beforeHidden()

{

    $("#result").text("隐藏前：$(\"input:hidden\").length="+$("input:hidden").length+";$(\"input[type=hidden]\").length="+$("input[type=hidden]").length);

}

function afterHidden()

{

    $("#div1").hide();

    $("#result").append("<br/>隐藏后：$(\"input:hidden\").length="+$("input:hidden").length+";$(\"input[type=hidden]\").length="+$("input[type=hidden]").length);

}

</script>

</head>

<body>

<form id="form1" name="form1" method="post" action="">

<div id="div1">

<input type="text"  id="txt" />

<input type="radio" id="rdo" /><label for="rdo">单选框</label>

<input type="checkbox" id="chx"/><label for="chx">复选框</label>

<br />

<input type="button" id="btn1" value="原始" onclick="beforeHidden();"/>

</div>
<input type="hidden" id="hd"/>

<input type="button" id="btn2" value="隐藏后" onclick="afterHidden();"/>

<div id="result"></div></form>

</body>

</html>

例子中，div1被隐藏前，$("input:hidden").length=1;$("input[type=hidden]").length=1，隐藏后，隐藏后：$("input:hidden").length=5;$("input[type=hidden]").length=1，显然，div1中的<input type="text"  id="txt" />
<input type="radio" id="rdo" />
<input type="checkbox" id="chx"/>
<input type="button" id="btn1" value="原始"/>也被包含进来了，而$("input[type=hidden]").length始终没有变。

jquery中选择器input:hidden和input[type=hidden]的区别的更多相关文章

  1. jquery中选择器的 html() text() val() attr() 方法的区别与使用方式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. jquery中innerwidth，outerwidth，outerwidth和width的区别

    在jQuery中,width()方法用于获得元素宽度: innerWidth()方法用于获得包括内边界(padding)的元素宽度, outerWidth()方法用于获得包括内边界(padding)和 ...

  3. jquery中ready函数,$(function(){})与自执行函数的区别

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. 详解jQuery中 .bind() vs .live() vs .delegate() vs .on() 的区别

    转载自:http://zhuzhichao.com/2013/12/differences-between-jquery-bind-vs-live/ 我见过很多开发者很困惑关于jQuery中的.bin ...

  5. 在JQuery中$(document.body)和这个$("body") 这两的区别在哪里？

    两种写法代表的是同一个对象 $("body") 是一个选择器,jQuery 会从 DOM 顶端开始搜索,直到找到标签为 body 的元素. 而 $(document.body) 中 ...

  6. jQuery中append()、prepend()与after()、before()的区别

    转载 未曾见海  https://www.cnblogs.com/afei-qwerty/p/6682963.html 在jQuery中,添加元素有append(),prepend() 和 after ...

  7. jquery中append、prepend, before和after方法的区别（一）

    原文:http://blog.csdn.net/woosido123/article/details/64439490 在 jquery中append() 与 prepend()是在元素内插入内容(该 ...

  8. JQuery中阻止事件冒泡的两种方式及其区别

    JQuery 提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation(); $("#div1").mousedown(function(event){ ...

  9. jQuery中操作属性的方法attr与prop的区别

    attr 与 prop 都可以对某个属性进行获取和设置的操作,二者的用法相同: <script src = 'jQuery.js'></script> <script&g ...

随机推荐

  1. TensorFlow激活函数+归一化-函数

    激活函数的作用如下-引用<TensorFlow实践>: 这些函数与其他层的输出联合使用可以生成特征图.他们用于对某些运算的结果进行平滑或者微分.其目标是为神经网络引入非线性.曲线能够刻画出 ...

  2. Java字符串处理

    代码: import java.util.Scanner; public class Main { public static void main(String[] args) { Scanner s ...

  3. Stall Reservations POJ - 3190（贪心）

    Oh those picky N (1 <= N <= 50,000) cows! They are so picky that each one will only be milked ...

  4. POJ 3264 Balanced Lineup（模板题）【RMQ】

    <题目链接> 题目大意: 给定一段序列,进行q次询问,输出每次询问区间的最大值与最小值之差. 解题分析: RMQ模板题,用ST表求解,ST表用了倍增的原理. #include <cs ...

  5. HDU 1301-Jungle Roads【Kruscal】模板题

    题目链接>>> 题目大意: 给出n个城市,接下来n行每一行对应该城市所能连接的城市的个数,城市的编号以及花费,现在求能连通整个城市所需要的最小花费. 解题分析: 最小生成树模板题,下 ...

  6. superset链接本地mysql数据库

    刚安装好superset的时候大家都知道是用的其自动生成的sqllite数据库,如果我们想让器链接到自己数据库,给大家分享一下我的方法,以mysql为例: 1.安装好数据库mysql: $ sudo ...

  7. babel那些事儿

    从前,一提到新东西,我的反应就是兼容性好不好,如果不能满足产品经理的需求,就还是用保守的方式实现吧.毕竟前端开发是一件很灵活的事,怎么写都行,至于为何会用某种方法,一定是综合考虑兼容性,性能,用户体验 ...

  8. pandas 基本操作

    1.     一维数据结构Series a.   概念:Series 是pandas 的一维数据结构,有重要的两个属性 index 和values b.  初始化: 可以通过 python 的 Lis ...

  9. angular笔记_8(事件)

    ng-click               鼠标点击 ng-dblclick          鼠标双击 ng-change          value改变 ng-blur             ...

  10. 关闭VS2015的WPF UI调试工具

    VS菜单: 工具 > 选项 > 调试 > 常规 > 启用Xaml 的UI调试工具.把勾勾去掉.