《精通asp.net mvc3框架》第20章
1、jquery檔案
jquery-1.5.1.js:jquey核心庫常規版
jquery-1.5.1.min.js:jquery核心庫最小化版
jquery-ui.js:jquery ui庫的常規版
jquery-unobtrusive-ajax.js:非唐突ajax支援庫的常規版
jquery-validate.js:非唐突客戶端驗證的常規版
jquery-1.5.1-vsdoc.js:對核心庫的只能感知支援
新增智慧型感知:
@if (false)
2、選擇器
(1)基本的jquery選擇器
$('*'):選擇文件中所有元素
$('.myclass'):選擇css的class值為myclass的所有元素
$('element'):選擇$('td,th'):選擇所有的td和th元素
$('td input'):選擇包含在td元素中的所有input元素
(2)屬性選擇器
$('[attr]'):選擇有attr屬性的元素,不考慮屬性值
$('[attr]="value"'):選擇有attr屬性且其值為value的元素
$('[attr]!="value"'):選擇有attr屬性且其值不為value的元素
$('[attr]^="value"'):選擇有attr屬性且其值以value開頭的元素
$('[attr]~="value"'):選擇有attr屬性且其值包含value的元素
$('[attr]$="value"'):選擇有attr屬性且其值以value結尾的元素
$('[attr]|="value"'):選擇有attr屬性且其值為value或以value開頭或value後跟連線符(value-)的元素
組合屬性選擇器:$('[type][value="delete"]'):選擇有type屬性,且value屬性值為delete的那些元素
3、過濾器
$('td:eq(8)'):過濾與選擇匹配的元素陣列中的第9項
(1)基本過濾器
:eq(n)-選擇所選內容的第n+1項
:even :old-選擇偶數或奇數元素
:first :last-選擇第乙個或最後乙個元素
:gt(n) :lt(n)-選擇索引號大於或小於n的元素
:header-選擇所有標題元素
:not(selector)-選擇所有與選擇器不匹配的元素
過濾器需要和選擇器聯合,當單獨使用時,預設使用了$('*')選擇器,如$(':header')
使用多個過濾器:$('td:odd:eq(1)'):選擇td元素,對其過濾只保留奇數項,然後選擇第2項
(2)內容過濾器
:contains('text') 選擇含有text或其子元素含有text的元素
:has('selector') 選擇至少有乙個子元素與selector匹配的元素
:empty 選擇沒有子元素的元素
:parent 選擇至少有乙個其他元素的元素
:first-child 選擇它們父節點的第乙個子元素
:last-child 選擇它們父元素的最後乙個子元素
:nth-child(n) 選擇它們父元素下的第n個子元素(索引從1開始)
:only-child 選擇它們父節點的唯一子元素
(3)表單過濾器
:button 選擇按鈕元素,以及其type為button的input元素
:checkbox 選擇核取方塊
:checked 選擇被選中的核取方塊和單選按鈕元素
:diasbled :enabled 選擇啟動或禁用的項
:input 選擇input元素
:password 選擇口令元素
:radio 選擇單選按鈕
:reset 選擇type為reset的元素
:selected 選擇被選中的option元素
:submit 選擇type為submit的input元素
:text 選擇type為text的input元素
4、jquery方法
(1)簡單示例
$('p span').addclass('superbig') 對包含在節點中的所有節點,新增乙個值為superbig的css的class
$('.superbig').removeclass('superbig') 從包含css的class為superbig的所有節點刪除這個class
$('#option').toggle() 切換id為options的元素的可見性
$('div:has(input[type="checkbox"]:disabled)').prepend('hey!') 在含有禁用核取方塊的所有div元素的頂部插入標記
$('#options a').css('color','red').fadeout() 在id為options的元素中找出所有超連結標籤,將它們的文字顏色設為red,通過把它們的不透明度緩慢調節到零的方式淡出檢視;
(2)等待dom
(document).ready()函式,在dom載入就緒之後,但在**(影象)可用之前,才會執行jquery**;
(3)使用jquery的css方法
addclass('myclass') :將制定的class新增到選中元素的class屬性
hasclass('myclass'):如果選中的元素具有制定的class,返回true
removeclass('myclass') :從選中元素的class屬性中刪除制定的class名
toggleclass('myclass') :如果制定的class不存在,新增,否則刪除
css('property','value'):將制定的屬性和值新增到選中元素的style屬性
(4)使用dom
jquery操作dom,可以新增、刪除和修改dom元素,甚至可以把元素從dom的乙個部門移動到另乙個部分;
常見的jquery dom導航方法
children() 獲取選中元素的子節點
next() 獲取緊隨選中元素之後的同胞元素
prev() 獲取緊鄰選中元素的前乙個同胞元素
parent() 返回選中元素的上一級父節點
sibilings() 返回選中元素的同胞節點
5、使用jquery事件
jquery庫含有乙個很好的時間處理系統,它支援所有底層js事件;
$('form[action$="/deletesummit"]').submit(function () );
6、使用jquery視覺效果
jquery視覺效果方法:
fadein() 通過增加不透明度逐漸顯示選中元素(淡入)
fadeout() 通過降低不透明度逐漸隱藏選中元素(淡出)
fadeto() 將元素淡化到指定的不透明度
fadetoggle() 通過改變不透明度逐漸顯示或隱藏元素
hide() 立即隱藏選中元素
show() 立即顯示選中元素
slidedowm() 以下滑到頁面的動畫顯示元素
slidetoggle() 用滑動效果顯示或隱藏元素
slideup() 以上滑到頁面的動畫顯示元素
toggle() 立即隱藏可見元素,立即顯示隱藏元素
7、jquery ui
引用
Jquery知識點彙總
1 jquery物件轉換成dom物件 a.var cr cr jquery物件 var cr cr 0 dom物件 alert cr.checked 檢測checkbox是否被選中了 b.var cr cr jquery物件 var cr cr.get 0 dom物件 alert cr.checke...
jquery常用知識點
1.原生的js 如果編寫多個入口函式,後面編寫的會覆蓋前面編寫的。2.jquery 中如果編寫多個入口函式,後面的不會覆蓋前面的。靜態方法 靜態方法通過類名呼叫 例項方法 例項方法通過例項呼叫 function fn fn.prototype.name lina var fn new fn cons...
JQuery常用知識點
jquery知識點 jquery定義 jquery 就是乙個簡單高效的 js 庫 jq 封裝的 是 js dom 的 部分 不需要考慮相容問題 帶 min 壓縮版本 刪除了注釋 換行 提高網頁載入效率 上線使用 不帶 min 無壓縮 1.多庫共存 在多個js庫應用於同乙個專案中時,符 會存在衝突的情...