DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> jQuery復習到的部分內容
jQuery復習到的部分內容
編輯:JQuery特效代碼     

jQuery選擇器
$(#id)==docunment.getelementById();
-基本選擇器(basic)
$("#test")//獲取id為test的元素 $(".test")//獲取所有class為test的元素 $("div,span,p.myClass")選取所有<div>,<span>和擁有class為myClass的<p>標簽的一組元素
$(".class"),根據css的class屬性返回一個集和,無論該css類是否存在,只要定義在元素中就能被jQuery查詢到
-層次選擇器(level):
<"div span">表示div下所有的span元素 <"div > span"> 表示div下子元素(不包括內嵌的)
-過濾選擇器(filter)
.sibling("div") 選取所有的同輩的
.next()
.prev()上一個
.基本過濾
:first $("div:first")選取所有<div>元素中第一個<div>元素
:last
:not(selector) $("input:not(myClass)")選取class不是myClass的<input>元素
:even 偶數 $("input:event") 選取索引是偶數的<input>元素
:odd奇數
:eq(index) $("input:eq(1)")選取索引等於1的<input>元素
:gt(index) 大於 但不包括
:lt(index) 小於
:animated $("div:animated")選取正在執行動畫的<div>元素
內容過濾
:contains $("div:contains('我')")選取含有文本“我”的<div>元素
:empty $("div:empty") 選取不包含子元素(包括文本元素)的<div>空元素
:has(selector) $("div:has(p)") 選取含有<p>元素的 <div>元素
:parent $("div:parent") 選取擁有子元素(包括文本元素)的<div>元素

可見性過濾:
:hidden $(":hidden")選取所有不可見的元素。
:visible $("div:visible")選取所有可見的<div>元素
屬性過濾
[attribute] $("div[id]")選取擁有屬性id的元素
[attribute=value] $("div[title=test]")選取屬性title為“test”的<div>元素
[attribute!=value] 同上但也包括沒有此屬性的元素
[attribute^=value] $("div[title^=test]")選取屬性title以“test”開頭的<div>元素
[attribute$=value] 結束
[attribute*=value] 含有value的元素
$([div[id]][title$='test'])選取擁有屬性id,並且屬性title為以test結束的<div>元素
子元素過濾
:nth-child(index/even/odd/equation) 選取每個父元素下的第index個子元素或者奇數偶數元素(index從1開始)
:first-child 選取每個父元素的第1個子元素 $("ul li:first-child")選取每個<ul>中第一個li元素
:last-child
:only-child 如果某個元素是它父元素中唯一的子元素將會匹配
表單對象屬性過濾
:enabled $("#form1 :enabled")選取id為“form1”的表單內的所有可用元素
:disabled
:checked $("input:checked")選取所有被選中的<input>元素
:selected $("select :selected")選取所有被選中的選項元素
-表單選擇器(form)
:input $(":input")

$('.test :hidden')//選擇class為test的元素當中的隱藏子元素
$('.test:hidden')//選擇隱藏的class為test元素

<p>我想說</p>
jQuery代碼
1.$("p").append("<b>你好</b>");
結果:
<p>我想說:<b>你好</b></p>
2.jQuery代碼
$("<b>你好</b>").appendTo("p");
結果
<p>我想說:<b>你好</b></p>
3.jQuery代碼
$("p").prepend("<b>你好</b>")//結果 <p><b>你好</b>我想說:</p>
4.jQuery代碼
$("<b>你好</b>").prependTo("p");//結果 <p><b>你好</b>我想說:</p>

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved