程序博客网 > c语言求最大公约数和

jquery选择器篇

来源：互联网 发布：c语言求最大公约数和 编辑：程序博客网 时间：2024/05/18 05:02


var j = jQuery.noConflict();

让出对变量$的控制权，并将jquery付给别名j

jquery.noConflict(true);让出对变量$和jquery的控制权

jQuery(selector, context)  

selector 表示选择器

<div ><div><input/></div></div>

$(div <div <input)

$(div).find(div).find(input).eq(0)

context 表示jquery对象

<div id="n1">    <div id="n2">        <ul id="n3">            <li id="n4">item1</li>            <li id="n5">item2</li>            <li id="n6">item3</li>        </ul>    </div>  </div>
var $li = $("ul li");// 返回当前文档的document对象document.writeln( $li.context ); // [object HTMLDocument]document.writeln( $li.context === document ); // truevar n1 = document.getElementById("n1");var $n3 = $( "#n3", n1 );// 返回n1document.writeln( $n3.context ); // [object HTMLDivElement]document.writeln( $n3.context === n1 ); // truevar $n2 = $("#n2");var $n4 = $( "#n4", $n2 );// 返回$n2的context属性：document对象document.writeln( $n4.context ); // [object HTMLDocument]document.writeln( $n4.context === document ); // truevar $n3 = $("#n3", n1);var $n5 = $( "#n5", $n3 );// 返回$n3的context属性：n1document.writeln( $n5.context ); // [object HTMLDivElement]document.writeln( $n5.context === n1 ); // true



jQuery.length 属性详解

length表示jquery对象封装的dom元素个数,如果该对象是一个空的jQuery对象，没有封装任何元素，则返回0。

jQuery.size() 函数详解

size()函数用于返回当前jQuery对象封装的元素个数。

jQuery.index() 函数详解


index()函数用于获取当前jQuery对象中指定DOM元素的索引值。


Jquery("#id") 通过id访问元素


Jquery("Div")通过TagName访问元素

Jquery(".className") 通过className访问元素

<div id="n1">    <p id="n2" class="test"></p>    <p id="n3" class="detail">        <span id="n4" class="test codeplayer"></span>    </p></div>

// 选择了id分别为n1、n2、n4的三个元素$("#n1,#n2,span.test");
// 选择了id分别为n3、n2、n4的三个元素$("p.detail,.test");

jQuery 选择器(parent > child)详解

// 这里的parent表示具体的父辈选择器// 这里的child表示具体的子辈选择器jQuery( "parent > child" )

<div id="n1">    <p id="n2" class="test">        <span id="n3" class="a">Hello</span>    </p>    <p id="n4" class="detail">        <span id="n5" class="b codeplayer">World            <span id="n6" class="c">365mini.com</span>        </span>    </p></div>

// 选择了id分别为n3、n5的两个元素// n6不是p标签的子元素，而是孙子辈的元素，因此无法匹配$("p > span");

我们可以配合使用所有元素选择器(*)来实现只查找孙子辈元素的选择器。例如：我们想要查找id为n1的元素的孙子辈的span标签，对应的jQuery代码如下：

// 选择了id分别为n3、n5的两个元素$("#n1 > * > span");

jQuery 选择器(prev + next)详解

选择器next的查找范围必须是与"prev元素"相邻的下一个元素，并且必须是"prev元素"的同辈元素。


<div id="n1">    <p id="n2" class="test">        <span id="n3" class="a">Hello</span>        <span id="n4">Hello</span>    </p>    <p id="n5" class="detail">        <span id="n6" class="b codeplayer">World            <span id="n7" class="a">http://365mini.com</span>            <span id="n8"></span>            <span id="n9"></span>        </span>    </p></div>

现在，我们想要查找与p标签相邻的下一个同辈p标签，则可以编写如下jQuery代码：

// 选择了id为n5的一个元素$("p + p");

接着，我们查找与span标签相邻的下一个同辈span标签，则可以编写如下jQuery代码：

// 选择了id分别为n4、n8、n9的三个元素// n4是n3的next，n8是n7的next，n9是n8的next$("span + span");


查找与包含类名a的span标签相邻的下一个同辈span标签，对应的jQuery代码如下：

// 选择了id分别为n4、n8的两个元素// n8没有包含类名a，因此无法匹配其next——n9$("span.a + span");
jQuery 选择器(prev ~ siblings)详解
jQuery的prev ~ siblings选择器用于匹配prev元素之后的所有同辈的siblings元素，将其封装为jQuery对象并返回。

<div id="n1">    <p id="n2" class="test">        <span id="n3" class="a">Hello</span>        <span id="n4">Hello</span>    </p>    <p id="n5" class="detail">        <span id="n6" class="b codeplayer">World            <span id="n7" class="a">http://365mini.com</span>            <span id="n8"></span>            <span id="n9"></span>        </span>    </p></div>

// 选择了id为n5的一个元素$("p ~ p");

// 选择了id分别为n4、n8、n9的三个元素// n9属于n7的~siblings，也是n8的~siblings，同一个元素只计入一次$("span ~ span");

jQuery 选择器(:first)详解

jQuery的:first选择器用于获取匹配到的第一个元素，将其封装为jQuery对象并返回。:first选择器等价于:eq(0)选择器。

// 选择了id为n1的一个元素$("div:first");
// 选择了id为n4的一个元素// 虽然HTML中有两个ul标签，但:first不是分别取每个ul中的第一个li，而是从上到下只要找到一个符合条件的元素就立即返回$("ul li:first");

jQuery 选择器(:last)详解
jQuery的:last选择器用于获取匹配到的最后一个元素，将其封装为jQuery对象并返回。
与该选择器相对的是:first选择器，用于获取匹配到的第一个元素。
// 选择了id为n7的一个元素$("div:last");
Jquery选择器（：even）
jQuery的:even选择器用于匹配所有索引值为偶数的元素，将其封装为jQuery对象并返回。
<div id="n1">    <div id="n2">        <ul id="n3">            <li id="n4">item1</li>            <li id="n5">item2</li>            <li id="n6">item3</li>        </ul>    </div>    <div id="n7">        <table id="n8">            <tr id="n9"><td>cell1</td></tr>            <tr id="n10"><td>cell2</td></tr>            <tr id="n11"><td>cell3</td></tr>        </table>    </div></div>
// 选择了id分别为n9、n11的两个元素$("tr:even");

jquery(:odd)查找索引值为基数的元素
jQuery 选择器(:eq(index))详解
// 这里的selector表示具体的选择器// 这里的index表示指定的索引值jQuery( "selector:eq(index)" )
<div id="n1">    <div id="n2">        <ul id="n3">            <li id="n4">item1</li>            <li id="n5">item2</li>            <li id="n6">item3</li>        </ul>    </div>    <div id="n7">        <ul id="n8">            <li id="n9">item1</li>            <li id="n10">item2</li>        </ul>    </div></div>
现在，我们想要查找第2个div标签，则可以编写如下jQuery代码：
// 选择了id为n2的一个元素$("div:eq(1)");
接着，获取匹配ul li选择器的元素中的第4个元素，则可以编写如下jQuery代码：
// 选择了id为n9的一个元素$("ul li:eq(3)");
:gt(index)大于索引的元素
:lt(index)小于索引的元素

jQuery 选择器(:first-child)详解
jQuery的:first-child选择器用于匹配作为父元素的第一个子元素的元素，将其封装为jQuery对象并返回。:first-child选择器等价于:nth-child(0)选择器。
<div id="n1">    CodePlayer    <div id="n2">        <ul id="n3">            <li id="n4">item1</li>            <li id="n5" class="c">item2</li>            <li id="n6" class="c">item3</li>        </ul>    </div>    <div id="n7">        <ul id="n8">            <li id="n9">item1</li>            <li id="n10">item2</li>        </ul>    </div></div>
// 选择了id分别为n4、n9的两个元素$("ul li:first-child");

jQuery 选择器(:only-child)详解
jQuery的:only-child选择器用于匹配作为父元素的唯一子元素的元素，将其封装为jQuery对象并返回。

<div id="n1">    <div id="n2">        CodePlayer--专注于编程开发技术分享        <ul id="n3">            <li id="n4">item1</li>            <li id="n5">item2</li>            <li id="n6">item3</li>        </ul>    </div>    <div id="n7">        <ul id="n8">            <li id="n9">item1</li>        </ul>    </div></div>
现在，我们想要查找不同父辈元素的最后一个div标签，则可以编写如下jQuery代码：
// 选择了id为n9的一个元素$("ul li:only-child");
查找作为父元素的"独生子"的ul标签，则可以编写如下jQuery代码：
// 选择了id分别为n3、n8的两个元素// n3的父元素n2虽然有自己的文本内容，但是只有n3这一个子元素，因此n3也算是唯一子元素$("ul:only-child");
jQuery 选择器(:nth-child(n))详解
jQuery的:nth-child(n)选择器用于匹配作为父元素下的第n个(或特定顺序的)子元素的元素，将其封装为jQuery对象并返回。

  • :nth-child(odd)表示匹配作为父元素的奇数(第1、3、5、7……个)子元素的元素；
  • :nth-child(even)表示匹配作为父元素的偶数(第2、4、6、8……个)子元素的元素；
  • :nth-child(3n)表示匹配作为父元素的第3n个子元素的元素(n表示包括0在内的自然数，下同)；
  • :nth-child(3n+1)表示匹配作为父元素的第3n+1个子元素的元素；
  • :nth-child(3n+2)表示匹配作为父元素的第3n+2个子元素的元素；
<div id="n1">    <div id="n2">        <ul id="n3">            <li id="n4" class="c">item1</li>            <li id="n5">item2</li>            <li id="n6" class="c">item3</li>        </ul>    </div>    <div id="n7">        <ul id="n8">            <li id="n9">item1</li>            <li id="n10">item2</li>        </ul>    </div></div>
现在，我们想要为每个ul标签内查找它的第2个li标签，则可以编写如下jQuery代码：
// 选择了id分别为n5、n10的两个元素$("ul li:nth-child(2)");
接着，为每个ul标签查找自然顺序为奇数的li标签，则可以编写如下jQuery代码：
// 选择了id分别为n4、n6、n9的3个元素$("ul li:nth-child(odd)");
jQuery 选择器(:nth-last-child(n))详解
jQuery的:nth-last-child(n)选择器用于匹配作为父元素下的倒数第n个子元素或符合特定顺序规则的元素，将其封装为jQuery对象并返回。

jQuery 选择器(:first-of-type)详解
jQuery的:first-of-type选择器用于匹配作为父元素的第一个该类型的子元素的元素，将其封装为jQuery对象并返回。:first-of-type选择器等价于:nth-of-type(1)选择器。
<div id="n1">    <div id="n2" class="abc">        <label id="n3">label1</label>        <span id="n4">span1</span>        <span id="n5" class="abc">span2</span>        <span id="n6">span3</span>    </div>    <div id="n7">        <span id="n8" class="abc">span1</span>        <span id="n9">span2</span>    </div></div>

现在，我们查找作为父元素的span类型子元素中的"长子"的span标签，则可以编写如下jQuery代码：
// 选择了id分别为n4、n8的两个元素// n4虽然不是n2的第一个子元素，但它是n2所有span类型子元素中的第一个，因此可以匹配$("span:first-of-type");
接着，查找所有包含类名abc的元素，而且它们必须是父元素的该类型子元素中的"长子"，则可以编写如下jQuery代码：
// 选择了id分别为n2、n8的两个元素// .abc可以匹配id分别为n2、n5、n8的3个元素，n2是n1所有div类型子元素中的第一个，n8是n7所有span类型子元素中的第一个，但n5不是n2所有span类型子元素中的第一个，因此不能匹配n5。$(".abc:first-of-type");
jQuery 选择器(:has(selector))详解
jQuery的:has(selector)选择器用于匹配所有包含selector元素的元素，将其封装为jQuery对象并返回。
<div id="n1">    <p id="n2" class="test">        <span id="n3" class="a">Hello</span>        <span id="n4">Hello</span>    </p>    <p id="n5" class="detail">        <span id="n6" class="b codeplayer">World            <span id="n7" class="a">http://365mini.com</span>            <span id="n8"></span>            <span id="n9"></span>        </span>    </p></div>
现在，我们想要在id为n1的div标签内查找所有包含span标签的元素，则可以编写如下jQuery代码：
// 选择了id分别为n2、n5、n6的3个元素$("#n1 :has(span)");
接着，我们在id为n1的div标签内查找包含类名为b的span标签的元素，则可以编写如下jQuery代码：
// 选择了id为n5的一个元素$("#n1 :has(span.b)");

jQuery 选择器(:not(selector))详解
jQuery的:not(selector)选择器用于排除所有与选择器selector匹配的元素，并将剩余的其他DOM元素封装为jQuery对象并返回。
<div id="n1">    <div id="n2">        <ul id="n3">            <li id="n4">item1</li>            <li id="n5">item2</li>            <li id="n6">item3</li>        </ul>    </div>    <div id="n7">        <ul id="n8">            <li id="n9">item1</li>            <li id="n10">item2</li>        </ul>    </div></div>
现在，我们想要查找除了id为n2的元素以外的所有元素，则可以编写如下jQuery代码：
// 选择除了id为n2的元素以外的所有元素，包括html、head、style、link、title、meta、script等$(":not(#n2)"); // 这相当于 $("*:not(#n2)");
接着，查找所有ul标签中除了id为n5的li标签以外的所有li标签，则可以编写如下jQuery代码：
// 选择了id分别为n4、n6、n9、n10的4个元素$("ul li:not(#n5)");


jQuery 选择器(:contains(text))详解

jQuery的:contains(text)选择器用于匹配包含指定文本的元素，将其封装为jQuery对象并返回。

<div id="n1">    <div id="n2">            <span id="n3">张三</span>            <span id="n4">CodePlayer</span>    </div>    <div id="n5">        <span id="n6">CodePlayer</span>    </div>    <div id="n7">        CodePlayer    </div></div>

现在，我们想要在id为n1的div标签内查找所有包含字符串"CodePlayer"的元素，则可以编写如下jQuery代码：
// 选择了id分别为n2、n4、n5、n6、n7的5个元素// n5的子元素n6中包含"CodePlayer"，因此n5也会被计入在内$("#n1 :contains(CodePlayer)");
接着，在id为n1的div标签内查找所有包含字符串"张三"的元素，则可以编写如下jQuery代码：
// 选择了id分别为n2、n3的两个元素// n2的子元素n3包含"张三"，因此n2也会被计入在内$("#n1 :contains(张三)");

jQuery 选择器(:empty)详解
空的元素，是指该元素既不包含子元素，也不包含文本内容(哪怕是空格或换行符，也算有文本内容)。

以下面这段HTML代码为例：
<div id="n1">    <div id="n2">            <span id="n3">张三</span>            <span id="n4"> </span>    </div>    <div id="n5">        <span id="n6"></span>    </div>    <div id="n7">    </div></div>
现在，我们想要查找id为n1的div标签内所有有内容的元素，则可以编写如下jQuery代码：
// 选择了id为n6的一个元素$("#n1 :empty");
查找所有有内容的span标签，则可以编写如下jQuery代码：
// 选择了id为n6的一个元素$("span:empty");
jQuery 选择器(:visible)详解
jQuery的:visible选择器用于匹配所有可见的元素，将其封装为jQuery对象并返回。
以下面这段HTML代码为例：
<div id="n1">    <p id="n2" style="display: none;"></p>    <p id="n3">        <span id="n4">CodePlayer</span>        <input id="n5" type="hidden" value="专注于编程开发技术分享">        <span id="n6" style="visibility: hidden;">http://www.365mini.com</span>        <span id="n7" style="opacity: 0;">jQuery手册</span>    </p></div>
现在，我们想要在id为n1的div标签内查找所有可见的元素，则可以编写如下jQuery代码：
// 选择了id分别为n3、n4、n6、n7的4个元素$("#n1 :visible");
在id为n1的div标签内查找所有可见的span标签，则可以编写如下jQuery代码：
// 选择了id分别为n4、n6、n7的3个元素$("#n1 span:visible");
jquery 选择器（：hidden)详解
jQuery的:hidden选择器用于匹配所有不可见的元素，将其封装为jQuery对象并返回。

jQuery 选择器(:header)详解
jQuery的:header选择器用于匹配所有的标题元素(h1 ~ h6)，将其封装为jQuery对象并返回。
:header选择器会匹配h1、h2、h3之类的所有标题元素，如果你只想匹配某种标题元素，可以直接使用标签选择器，例如：$("h1")。

以下面这段HTML代码为例：
<div id="n1">    <h1 id="n2">标题1</h1>    <div id="n3">        <h2 id="n4">标题2</h2>    </div>    <div id="n5">        <h3 id="n6">标题3</h3>        <h3 id="n7">标题4</h3>    </div></div>
现在，我们想要查找所有的标题元素，则可以编写如下jQuery代码：
// 选择了id分别为n2、n4、n6、n7的4个元素$(":header");
接着，查找id为n5的div标签内的所有标题元素，则可以编写如下jQuery代码：
// 选择了id分别为n6、n7的两个元素$("#n5 :header");

jQuery 选择器(:focus)详解
jQuery的:focus选择器用于匹配当前获得焦点的元素，将其封装为jQuery对象并返回。
以下面这段HTML代码为例：
<div id="n1">    <input name="name" type="text" label="姓名"><br>    <input name="age" type="text" label="年龄"><br>    <input name="cellphone" type="text" label="手机号码"></div><div id="message"></div>
现在，我们为当前获得焦点的<input>元素显示提示信息，则可以编写如下jQuery代码：
// 当<input>元素获得焦点时，在#message中显示"请输入[姓名]"、"请输入[年龄]"等相应的提示信息。$("input").on("focus blur", function(){    var me = $(this);    var msg = me.is(":focus") ? ("请输入[" + me.attr("label") + "]") : "";    $("#message").html(msg);});
jQuery 选择器([attribute])详解
jQuery的[attribute]选择器用于匹配所有具有指定属性的元素，将其封装为jQuery对象并返回
以下面这段HTML代码为例：
<div id="n1">    <div id="n2">        <ul id="n3">            <li id="n4">item2</li>            <li id="n5" class="c" tabindex="3">item3</li>        </ul>    </div>    <div id="n6" class>        <ul id="n7">            <li id="n8" class="">item1</li>            <li id="n9">item2</li>        </ul>    </div></div>
现在，我们想要查找所有具有class属性的元素，则可以编写如下jQuery代码：
// 选择了id分别为n5、n6、n8的3个元素$("[class]");
接着，查找所有同时具有class属性和tabindex属性的元素，则可以编写如下jQuery代码：
// 选择了id为n5的一个元素$("[class][tabindex]");
jQuery 选择器([attribute=value])详解
jQuery的[attribute=value]选择器用于匹配指定属性为指定值的所有元素，将其封装为jQuery对象并返回。
以下面这段HTML代码为例：
<div id="n1">    <div id="n2">        <input id="n3" name="id[]" type="checkbox" value="1" >        <input id="n4" name="id[]" type="checkbox" value="2" >        <input id="n5" name="id[]" type="checkbox" value="3" >    </div>    <div id="n6">        <ul id="n7">            <li id="n8" dataId="5">item1</li>            <li id="n9">item2</li>        </ul>    </div></div>
现在，我们想要查找所有name属性为page_id[]的元素，则可以编写如下jQuery代码：
// 选择了id分别为n3、n4、n5的3个元素$("[name='id[]']");
接着，查找所有dataId属性为5的元素，则可以编写如下jQuery代码：
// 选择了id为n8的一个元素$("[dataId=5]");

jQuery 选择器([attribute!=value])详解
jQuery的[attribute!=value]选择器用于匹配指定属性不等于指定值的所有元素，将其封装为jQuery对象并返回。
<div id="n1">    <div id="n2">        <input id="n3" name="id[]" type="checkbox" value="1" >        <input id="n4" name="id[]" type="checkbox" value="2" >        <input id="n5" name="id[]" type="checkbox" value="3" >    </div>    <div id="n6">        <ul id="n7">            <li id="n8" dataId="x[5]">item1</li>            <li id="n9">item2</li>        </ul>    </div></div>
现在，我们想要查找所有id属性不等于n3的元素，则可以编写如下jQuery代码：
// 选择了id不等于n3的所有元素(包括html、body、style、script、title等标签)$("[id!=n3]");
接着，在id为n6的后代元素中查找所有dataId属性不等于x[5]的元素，则可以编写如下jQuery代码：
// 选择了id分别为n7、n9的两个元素$("#n6 [dataId!='x[5]']");
jQuery 选择器([attribute^=value])详解
jQuery的[attribute^=value]选择器用于匹配指定属性以指定值开始的所有元素，将其封装为jQuery对象并返回。
jQuery 选择器([attribute$=value])详解
jQuery的[attribute$=value]选择器用于匹配指定属性以指定值结尾的所有元素，将其封装为jQuery对象并返回。

以下面这段HTML代码为例：
<div id="n1">    <div id="n2">        <input id="n3" name="id[]" type="checkbox" value="1" >        <input id="n4" name="id[]" type="checkbox" value="2" >        <input id="n5" name="id[]" type="checkbox" value="3" >    </div>    <div id="n6">        <ul id="n7">            <li id="n8" dataId="x[5_1]">item1</li>            <li id="n9" dataId="x[5_2]">item2</li>            <li id="n10" dataId="x[6_1]">item3</li>        </ul>    </div></div>
现在，我们想要查找所有id属性以5结尾的元素，则可以编写如下jQuery代码：
// 选择了id为n5的一个元素$("[id$=5]");
接着，查找dataId属性以_1]结尾的所有元素，则可以编写如下jQuery代码：
// 选择了id分别为n8、n10的两个元素$("[dataId$='_1]']");

jQuery 选择器([attribute|=value])详解
jQuery的[attribute|=value]选择器用于匹配指定属性等于指定值或以指定值为前缀的所有元素，将其封装为jQuery对象并返回。这里的前缀，表示以指定值开头，与后面的部分以连线("-")进行连接。
以下面这段HTML代码为例：
<div id="n1">    <div id="n2">        <input id="n3" name="Code Player" type="checkbox" value="1" >        <input id="n4" name="Code-Player" type="checkbox" value="2" >        <input id="n5" name="CodePlayer" type="checkbox" value="3" >        <input id="n6" name="Code" type="checkbox" value="4" >    </div></div>
现在，我们想要查找所有name属性以Code为前缀的元素，则可以编写如下jQuery代码：
// 选择了id分别为n4、n6的两个元素$("[name|=Code]");

jQuery 选择器([attribute~=value])详解
jQuery的[attribute~=value]选择器用于匹配指定属性的值中包含指定单词的所有元素，将其封装为jQuery对象并返回。
返回封装了所有指定属性包含指定值作为"单词"的元素的jQuery对象。
这里的"单词"可以理解为常规英文书写中的单词表现形式，与其他"单词"以空格进行分隔。
如果找不到任何相应的匹配，则返回一个空的jQuery对象。
<div id="n1">    <div id="n2">        <input id="n3" name="Jim Anna jQuery" type="checkbox" value="1" >        <input id="n4" name="Jim-Anna-jQuery" type="checkbox" value="2" >        <input id="n5" name="Anna  Jim jQuery" type="checkbox" value="3" >        <input id="n6" name="Jim jQuery Anna" type="checkbox" value="3" >        <input id="n7" name="Anna" type="checkbox" value="4" >    </div></div>
现在，我们想要查找所有name属性中包含单词Anna的元素，则可以编写如下jQuery代码：
// 选择了id分别为n3、n5、n6、n7的4个元素$("[name~=Anna]");

jQuery 选择器([attribute*=value])详解
jQuery的[attribute*=value]选择器用于匹配指定属性包含指定值的所有元素，将其封装为jQuery对象并返回。
以下面这段HTML代码为例：
<div id="n1">    <div id="n2">        <input id="n3" name="xid1" type="checkbox" value="1" >        <input id="n4" name="yid2" type="checkbox" value="2" >        <input id="n5" name="zid3" type="checkbox" value="3" >    </div>    <div id="n6">        <ul id="n7">            <li id="n8" dataId="x[5_1]">item1</li>            <li id="n9" dataId="x[5_2]">item2</li>            <li id="n10" dataId="y[5_3]">item3</li>        </ul>    </div></div>
现在，我们想要查找所有name属性包含id的元素，则可以编写如下jQuery代码：
// 选择了id分别为n3、n4、n5的3个元素$("[name*=id]");
接着，查找dataId属性包含[5的所有元素，则可以编写如下jQuery代码：
// 选择了id分别为n8、n9、n10的3个元素$("[dataId*='[5']");

jQuery 选择器(:input)详解
jQuery的:input选择器用于匹配所有的表单控件元素，将其封装为jQuery对象并返回。

<div id="n1"><form id="n2">   <input id="n3" type="button" value="Input Button"/>   <input id="n4" type="checkbox" />   <input id="n5" type="file" />   <input id="n6" type="hidden" />   <input id="n7" type="image" />   <input id="n8" type="password" />   <input id="n9" type="radio" />   <input id="n10" type="reset" />   <input id="n11" type="submit" />   <input id="n12" type="text" />   <select id="n13">   <option id="n14">Option</option>   </select>   <textarea id="n15"></textarea>   <button id="n16">Button</button></form></div>
现在，查找所有的表单信息元素，则可以编写如下jQuery代码：
// 选择了id分别为n3 ~ n16(除了n14)的13个元素$(":input");
jQuery 选择器(:text)详解
jQuery的:text选择器用于匹配所有的单行文本框元素，将其封装为jQuery对象并返回。

<div id="n1">    <form id="n2">       <input id="n3" type="button" value="Input Button"/>       <input id="n4" type="checkbox" />       <input id="n5" type="file" />       <input id="n6" type="hidden" />       <input id="n7" type="image" />       <input id="n8" type="password" />       <input id="n9" type="radio" />       <input id="n10" type="reset" />         <input id="n11" type="submit" />       <input id="n12" type="text" />       <select id="n13">        <option id="n14">Option</option>       </select>       <textarea id="n15"></textarea>       <button id="n16">Button</button>    </form></div>
现在，我们查找所有的单行文本框元素，即可编写如下jQuery代码：
// 选择了id为n12的一个元素$(":text");
jQuery 选择器(:password)详解
jQuery的:password选择器用于匹配所有的密码框元素，将其封装为jQuery对象并返回。
密码框就是type为password的input标签：<input type="password">。
jQuery 选择器(:radio)详解
jQuery的:radio选择器用于匹配所有的单选按钮元素，将其封装为jQuery对象并返回。
单选按钮就是type为radio的input标签：<input type="radio">。
<div id="n1">    <form id="n2">       <input id="n3" type="button" value="Input Button"/>       <input id="n4" type="checkbox" />       <input id="n5" type="file" />       <input id="n6" type="hidden" />       <input id="n7" type="image" />       <input id="n8" type="password" />       <input id="n9" type="radio" />       <input id="n10" type="reset" />         <input id="n11" type="submit" />       <input id="n12" type="text" />       <select id="n13">        <option id="n14">Option</option>       </select>       <radioarea id="n15"></radioarea>       <button id="n16">Button</button>    </form></div>
现在，我们查找所有的单选按钮元素，即可编写如下jQuery代码：
// 选择了id为n9的一个元素$(":radio");
jQuery 选择器(:checkbox)详解
jQuery的:checkbox选择器用于匹配所有的复选框元素，将其封装为jQuery对象并返回。
复选框就是type为checkbox的input标签：<input type="checkbox">。
以下面这段HTML代码为例：
<div id="n1">    <form id="n2">       <input id="n3" type="button" value="Input Button"/>       <input id="n4" type="checkbox" />       <input id="n5" type="file" />       <input id="n6" type="hidden" />       <input id="n7" type="image" />       <input id="n8" type="radio" />       <input id="n9" type="radio" />       <input id="n10" type="reset" />         <input id="n11" type="submit" />       <input id="n12" type="text" />       <select id="n13">        <option id="n14">Option</option>       </select>       <radioarea id="n15"></radioarea>       <button id="n16">Button</button>    </form></div>
现在，我们查找所有的单行文本框元素，即可编写如下jQuery代码：
// 选择了id为n4的一个元素$(":checkbox");
jQuery 选择器(:button)详解
jQuery的:button选择器用于匹配所有的按钮元素，将其封装为jQuery对象并返回。
这里的按钮指的是所有的button标签(不区分type)以及type为button的input标签：
以下面这段HTML代码为例：
<div id="n1">    <form id="n2">       <input id="n3" type="button" value="Input Button"/>       <input id="n4" type="checkbox" />       <input id="n5" type="file" />       <input id="n6" type="hidden" />       <input id="n7" type="image" />       <input id="n8" type="password" />       <input id="n9" type="radio" />       <input id="n10" type="reset" />           <input id="n11" type="submit" />       <input id="n12" type="text" />       <select id="n13">        <option id="n14">Option</option>       </select>       <textarea id="n15"></textarea>       <button id="n16" type="button">Button</button>       <button id="n17" type="submit">Submit</button>       <button id="n18" type="reset">Reset</button>    </form></div>
现在，我们查找所有的普通按钮(type="button"的input标签)和button标签，即可编写如下jQuery代码：
// 选择了id分别为n3、n16、n17、n18的4个元素$(":button");
如果你只想匹配type为button的input标签，你可以编写如下jQuery代码：
// 选择了id为n3的一个元素$("input:button");
jQuery 选择器(:submit)详解
jQuery的:submit选择器用于匹配所有的提交按钮元素，将其封装为jQuery对象并返回。
提交按钮框就是type为submit的input或button标签：<input type="submit">或<button type="submit"></button>。
以下面这段HTML代码为例：
<div id="n1">    <form id="n2">       <input id="n3" type="button" value="Input Button"/>       <input id="n4" type="checkbox" />       <input id="n5" type="file" />       <input id="n6" type="hidden" />       <input id="n7" type="image" />       <input id="n8" type="password" />       <input id="n9" type="radio" />       <input id="n10" type="reset" />           <input id="n11" type="submit" />       <input id="n12" type="text" />       <select id="n13">        <option id="n14">Option</option>       </select>       <textarea id="n15"></textarea>       <button id="n16" type="submit">Button</button>    </form></div>
现在，我们查找所有的提交按钮，即可编写如下jQuery代码：
// 选择了id分别为n11、n16的两个元素$(":submit");
jQuery 选择器(:reset)详解
jQuery的:reset选择器用于匹配所有的重置按钮元素，将其封装为jQuery对象并返回。
重置就是type为reset的input或button标签：<input type="reset">或<button type="reset"></button>。
jQuery 选择器(:image)详解 
jQuery的:image选择器用于匹配所有的图像控件，将其封装为jQuery对象并返回。
图像域就是type为image的input标签：<input type="image">。

jQuery 选择器(:enabled)详解

jQuery的:enabled选择器用于匹配所有可用的表单控件元素，将其封装为jQuery对象并返回。
可用的表单控件是指没有disabled属性的<input>、<button>、<select>、<textarea>、<option>等元素。
<div id="n1">    <form id="n2">        <label id="n3">CodePlayer</label>        <input id="n4" type="text" disabled="disabled" >       <input id="n5" type="checkbox" />       <input id="n6" type="password" />       <button id="n7" type="button" disabled="disabled">Button</button>       <select id="n8">        <option id="n9">item1</option>        <option id="n10" disabled="disabled">item2</option>       </select>    </form></div>
现在，我们查找所有的可用元素，即可编写如下jQuery代码：
// 选择了id分别为n5、n6、n8、n9的4个元素$(":enabled");

jQuery 选择器(:checked)详解
jQuery的:checked选择器用于匹配所有选中的表单域元素，将其封装为jQuery对象并返回。
选中的表单域是指具有checked属性的radio和checkbox表单域，以及具有selected属性的option标签。

<div id="n1">    <form id="n2">        <label id="n3">CodePlayer</label>        <input id="n4" type="text" disabled="disabled" >       <input id="n5" type="checkbox" checked="checked" />       <input id="n6" type="checkbox" />       <input id="n7" type="radio" checked="checked" />            <input id="n8" type="radio" />              <button id="n9" type="button" disabled="disabled">Button</button>       <select id="n10">        <option id="n11" selected="selected">item1</option>        <option id="n12">item2</option>       </select>    </form></div>
现在，我们查找所有的提交按钮，即可编写如下jQuery代码：
// 选择了id分别为n5、n7、n11的3个元素// :checked可以匹配"selected"的option$(":checked");
如果你只希望匹配选中的radio和checkbox，请使用input:checked。
// 选择了id分别为n5、n7的两个元素$("input:checked");
如果你只希望匹配选中的checkbox，请使用:checkbox:checked。radio也是同理。
// 选择了id为n5的一个元素$(":checkbox:checked");

jQuery 选择器(:selected)详解
jQuery的:selected选择器用于匹配所有选中的option元素，将其封装为jQuery对象并返回。
选中的option元素指的是具有selected属性的option标签。
<div id="n1">    <form id="n2">        <label id="n3">CodePlayer</label>        <input id="n4" type="text" disabled="disabled" >       <input id="n5" type="checkbox" checked="checked" />       <input id="n6" type="checkbox" />       <input id="n7" type="radio" checked="checked" />            <input id="n8" type="radio" />              <button id="n9" type="button" disabled="disabled">Button</button>       <select id="n10">        <option id="n11" selected="selected">item1</option>        <option id="n12">item2</option>       </select>    </form></div>
现在，我们查找所有选中的option元素，即可编写如下jQuery代码：
// 选择了id为n11的一个元素$(":selected");
                                             
        0        0           
	
				
		









 c语言求最大公约数和
    		c语言求最大公约数和



原创粉丝点击



		

热门IT博客


php协同过滤推荐算法php协同过滤推荐算法




淘宝内部优惠券平台淘宝内部优惠券平台




erp软件介绍




听说科技软件多少钱




手机nfc写入软件




淘宝短信催付款话术




花生壳免费域名后缀




火牛下单软件




java算法书籍




如何打开淘宝我的店铺




mac 关闭手写输入




阿里云服务器空间满了




淘宝卖家注册流程




淘宝需要品牌授权




acl拆分盘源码




数据之巅 百度云




2017java经典书籍排行




中国卫星通信软件下载




2016外商直接投资数据




js 数字转换字符串



		

热门问题
    老师的惩罚
    人脸识别
    我在镇武司摸鱼那些年
    重生之率土为王
    我在大康的咸鱼生活
    盘龙之生命进化
    天生仙种
    凡人之先天五行
    春回大明朝
    姑娘不必设防，我是瞎子
    重庆著名小吃
    重庆周边游景点推荐
    重庆图片
    重庆附近好玩的地方
    重庆玩的地方
    自然风景
    高清风景
    婚纱照风景
    美丽风景
    自然风景图片
    风景美图
    风景作文600字
    古典油画风景
    风景的英文
    风景怎么样
    装饰画风景
    旅游风景图片
    风景英文
    澳洲风景
    风景 英文
    风景唯美
    风景花
    好看风景图片
    什么风景
    风景英语
    风景 英语
    美图风景
    介绍景点
    全国景点
    国内景点
    景点有哪些
    的景点
    推荐景点
    十一长假部分景区只在线售票
    神泉生态旅游景区门票
    野三坡百里峡景区
    野三坡鱼谷洞景区
    白云鹭鸶旅游景区
    景华
    景华新村
    景华装饰


	










程序博客网，程序员的互联网技术博客家园。csdn论坛精品 msdn技术资料都在这里