jQuery常用的選擇器

2022-05-06 03:57:09 字數 2159 閱讀 3109

1.鏈式風格

對應同乙個物件,不超過三個操作,可以寫成一行

$("li").show().unbind("click");
同乙個物件,多個操作,建議分多行寫,切加上注釋  

//等待dom元素載入完畢.

$(document).ready(function());

});

如下,不加注釋,很難看懂是什麼意思

//id為table的**裡,如果每一行的最後一列的checkbox 沒有被禁用,則把這一行的背景色設為紅色

$("#table>tbody>tr:has(td:last:has(:checkbox:enabled))").css("background","red");

2.jquery 和 dom 的區別

//和dom的區別

$("#foo").html(); //等同於document.getelementbyid("foo").innerhtml

$("#id").attr("checked"); //等同於document.getelementbyid("foo").checked

//宣告變數

var $variable = jquery 物件

var variable = dom 物件

//jquery 轉換為 dom

//jquery物件是個陣列物件,可以通過[index]來轉換為dom物件

var $arr = $("#id");

var a = $arr[0];

alert(a.checked);

//通過jquery 自己提供的方法get

var $arr = $("#id");

var a = $arr.get(0);

alert(a.checked);

//dom 轉 jquery 物件

var arr - document.getelementbyid("#id");

var $a = $(arr);

3.是否存在的判斷方式

//判斷方式

if (cr.checked) {}; //dom方式判斷

if ($cr.is(:checked)) {}; //jquery方式判斷

4. 解決jquery 庫和其他庫(prototype.js)的衝突

//解決jquery 庫和其他庫(prototype.js)的衝突

jquery.noconflict();//將變數$的控制權移交給prototype.js

jquery(function());

});$("#pp").style.display = 'none' ; //使用prototype

//先倒入jquery 庫,這樣就可以直接使用「jquery」來做jquery的工作,同時$()方法作為其他庫的快捷方式,無需呼叫jquery.noconflict()函式。

5.選擇器(1)基本選擇器(2)層次選擇器

(3)過濾選擇器

1).基本過濾選擇器

(4)表單選擇器

新聞預覽效果,點選到上顯示大圖預覽

$(function()).show("fast");

}).mouseout(function());

});

jquery 常用選擇器

myelement 選擇id值等於myelement的元素,id值不能重複在文件中只能有乙個id值是myelement所以得到的是唯一的元素 div 選擇所有的div標籤元素,返回div元素陣列 myclass 選擇使用myclass類的css的所有元素 選擇文件中的所有的元素,可以運用多種的選擇方...

jQuery常用選擇器

1.所有的函式大體分為四組 1 dom操作函式 2 事件處理函式 3 動畫函式 4 ajax操作 2.jquery函式的特性 1 幾乎所有的函式都自帶迴圈功能,可以對選中的元素進行遍歷 2 幾乎所有的函式都返回jquery物件本身,可以實現方法的鏈式呼叫 3 jquery物件轉換為dom物件 div...

jquery 常用選擇器

層次選擇器 div p 選取div下的所有的p元素 div p css border 1px solid red 只選取div下的直接子元素 相鄰的元素 divp cs s b orde r 1pxs olid red 與 div nextall p 等價 表示div後面的 所有p兄弟元素 div ...