欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

juqery 學(xué)習(xí)之三 選擇器 子元素與表單

 更新時(shí)間:2010年11月25日 19:54:19   作者:  
juqery 學(xué)習(xí)之三 選擇器 子元素與表單,學(xué)習(xí)jquery的朋友可以參考下。

:nth-child(index/even/odd/equation)

匹配其父元素下的第N個(gè)子或奇偶元素
':eq(index)' 只匹配一個(gè)元素,而這個(gè)將為每一個(gè)父元素匹配子元素。:nth-child從1開(kāi)始的,而:eq()是從0算起的!

可以使用:
nth-child(even)
:nth-child(odd)
:nth-child(3n)
:nth-child(2)
:nth-child(3n+1)
:nth-child(3n+2)


Matches the nth-child of its parent.

返回值

Array<Element>

參數(shù)

index (Number) : 要匹配元素的序號(hào),從1開(kāi)始

示例

在每個(gè) ul 查找第 2 個(gè)li

HTML 代碼:

<ul>
  <li>John</li>
  <li>Karl</li>
  <li>Brandon</li>
</ul>
<ul>
  <li>Glen</li>
  <li>Tane</li>
  <li>Ralph</li>
</ul>

jQuery 代碼:

$("ul li:nth-child(2)")

結(jié)果:

[ <li>Karl</li>,   <li>Tane</li> ]
--------------------------------------------------------------------------------

:first-child

匹配第一個(gè)子元素
':first' 只匹配一個(gè)元素,而此選擇符將為每個(gè)父元素匹配一個(gè)子元素

Matches the first child of its parent.

返回值

Array<Element>

示例

在每個(gè) ul 中查找第一個(gè) li

HTML 代碼:

<ul>
  <li>John</li>
  <li>Karl</li>
  <li>Brandon</li>
</ul>
<ul>
  <li>Glen</li>
  <li>Tane</li>
  <li>Ralph</li>
</ul>

jQuery 代碼:

$("ul li:first-child")

結(jié)果:

[ <li>John</li>, <li>Glen</li> ]

--------------------------------------------------------------------------------

:last-child

匹配最后一個(gè)子元素
':last'只匹配一個(gè)元素,而此選擇符將為每個(gè)父元素匹配一個(gè)子元素

Matches the last child of its parent.

返回值

Array<Element>

示例

在每個(gè) ul 中查找最后一個(gè) li

HTML 代碼:

<ul>
  <li>John</li>
  <li>Karl</li>
  <li>Brandon</li>
</ul>
<ul>
  <li>Glen</li>
  <li>Tane</li>
  <li>Ralph</li>
</ul>

jQuery 代碼:

$("ul li:last-child")

結(jié)果:

[ <li>Brandon</li>, <li>Ralph</li> ]

--------------------------------------------------------------------------------

:only-child

如果某個(gè)元素是父元素中唯一的子元素,那將會(huì)被匹配
如果父元素中含有其他元素,那將不會(huì)被匹配。

Matches the only child of its parent.

返回值

Array<Element>

示例

在 ul 中查找是唯一子元素的 li

HTML 代碼:

<ul>
  <li>John</li>
  <li>Karl</li>
  <li>Brandon</li>
</ul>
<ul>
  <li>Glen</li>

jQuery 代碼:

$("ul li:only-child")

結(jié)果:

[ <li>Glen</li> ]

--------------------------------------------------------------------------------

:input

匹配所有 input, textarea, select 和 button 元素

返回值

Array<Element>

示例

查找所有的input元素

HTML 代碼:

<form>
  <input type="text" />
  <input type="checkbox" />
  <input type="radio" />
  <input type="image" />
  <input type="file" />
  <input type="submit" />
  <input type="reset" />
  <input type="password" />
  <input type="button" />
  <select><option/></select>
  <textarea></textarea>
  <button></button>
</form>

jQuery 代碼:

$(":input")

結(jié)果:

[ <input type="text" />, <input type="checkbox" />, <input type="radio" />, <input type="image" />, <input type="file" />, <input type="submit" />, <input type="reset" />, <input type="password" />, <input type="button" /> ]

--------------------------------------------------------------------------------

:text

匹配所有的單行文本框

返回值

Array<Element>

示例

查找所有文本框

HTML 代碼:

<form>
  <input type="text" />
  <input type="checkbox" />
  <input type="radio" />
  <input type="image" />
  <input type="file" />
  <input type="submit" />
  <input type="reset" />
  <input type="password" />
  <input type="button" />
  <select><option/></select>
  <textarea></textarea>
  <button></button>
</form>

jQuery 代碼:

$(":text")

結(jié)果:

[ <input type="text" /> ]

--------------------------------------------------------------------------------

:password

匹配所有密碼框

返回值

Array<Element>

示例

查找所有密碼框

HTML 代碼:

<form>
  <input type="text" />
  <input type="checkbox" />
  <input type="radio" />
  <input type="image" />
  <input type="file" />
  <input type="submit" />
  <input type="reset" />
  <input type="password" />
  <input type="button" />
  <select><option/></select>
  <textarea></textarea>
  <button></button>
</form>

jQuery 代碼:

$(":password")

結(jié)果:

[ <input type="password" /> ]

--------------------------------------------------------------------------------

:radio

匹配所有單選按鈕

返回值

Array<Element>

示例

查找所有單選按鈕

HTML 代碼:

<form>
  <input type="text" />
  <input type="checkbox" />
  <input type="radio" />
  <input type="image" />
  <input type="file" />
  <input type="submit" />
  <input type="reset" />
  <input type="password" />
  <input type="button" />
  <select><option/></select>
  <textarea></textarea>
  <button></button>
</form>

jQuery 代碼:

$(":radio")

結(jié)果:

[ <input type="radio" /> ]

--------------------------------------------------------------------------------

:submit

匹配所有提交按鈕

返回值

Array<Element>

示例

查找所有提交按鈕

HTML 代碼:

<form>
  <input type="text" />
  <input type="checkbox" />
  <input type="radio" />
  <input type="image" />
  <input type="file" />
  <input type="submit" />
  <input type="reset" />
  <input type="password" />
  <input type="button" />
  <select><option/></select>
  <textarea></textarea>
  <button></button>
</form>

jQuery 代碼:

$(":submit")

結(jié)果:

[ <input type="submit" /> ]


其他的一些 都是一樣的道理:image   ,:reset,:button,:file,:hidden !@#@!%$%

相關(guān)文章

最新評(píng)論