jQuery的詳細解析以及用法

2021-10-25 05:56:49 字數 2723 閱讀 9067

jquery是乙個js庫,免費開源易用,提供了我們開發中常用到的操作dom的api,解決了我們使用js操作dom常遇到的一些問題,強大的選擇器,簡化我們的操作
a. 輕量級b. 富應用c. dom操作、事件處理、運動動畫、ajaxd. 跨瀏覽器(不再考慮瀏覽器相容)e. 鏈式呼叫f. 隱式迭代g. 豐富的外掛程式庫 .........

主版本號3是不相容ie9之前的瀏覽器主版本號1是相容所有瀏覽器

路徑引入

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

$(function());
區別一:書寫個數不同

js入口函式只能出現一次,出現多次會存在事件覆蓋的問題。

jquery的入口函式,可以出現任意多次,並不會存在事件覆蓋問題。

區別二:執行時機不同

jquery的入口函式,是在文件載入完成後,就執行。文件載入完成指的是:dom樹載入完成後,就可以操作dom了,不用等到所有的外部資源都載入完成。

jquery物件:

jquery選擇器拿到dom物件後又對其做了封裝,讓其具有了jquery方法的jquery物件,說白了,就是把dom物件重新包裝了一下。
第一種方式

var btn1 = $btn[0];
// 此時就把jquery物件$btn轉換成了dom物件btn1 (推薦使用此方式)第二種方式

var btn2 = $btn.get(0);// 此時就把jquery物件$btn轉換成了dom物件btn2
使用$(domobject)包裹就可以包裝成乙個jquery物件

jquery選擇器是jquery強大的體現,它提供了一組方法,讓我們更加方便的獲取到頁面中的元素。語法和css的選擇符保持一致。
id選擇器
--示例$(「#btnshow」).css(「color」, 「red」);選擇id為btnshow的乙個元素(返回值為jquery物件)

類選擇器
--示例$(「.liitem」).css(「color」, 「red」);選擇含有類liitem的所有元素

"element"

標籤選擇器
--示例$(「li」).css(「color」, 「red」);選擇標籤名為li的所有元素

"空格"

層級選擇器(後代選擇器)
--示例$(「#j_wrap li」).css(「color」, 「red」);選擇id為j_wrap的元素的所有後代元素li

子代選擇器
--示例$(「#j_wrap > ul > li」).css(「color」, 「red」);選擇id為j_wrap的元素的所有子元素ul的所有子元素li

":eq(index)"

選擇匹配到的元素中索引號為index的乙個元素,index從0開始
--示例$(「li:eq(2)」).css(「color」, 」red」);選擇li元素中索引號為2的乙個元素

":odd"

選擇匹配到的元素中索引號為奇數的所有元素,index從0開始
--示例$(「li:odd」).css(「color」, 「red」);選擇li元素中索引號為奇數的所有元素

":even"

選擇匹配到的元素中索引號為偶數的所有元素,index從0開始
--示例$(「li:odd」).css(「color」, 「red」);選擇li元素中索引號為偶數的所有元素

find(selector)

查詢指定元素的所有後代元素(子子孫孫)
--示例$(「#j_wrap」).find(「li」).css(「color」, 「red」);選擇id為j_wrap的所有後代元素li

children()

查詢指定元素的直接子元素(親兒子元素)
--示例$(「#j_wrap」).children(「ul」).css(「color」, 「red」);選擇id為j_wrap的所有子代元素ul

siblings()

查詢所有兄弟元素(不包括自己)
--示例$(「#j_liitem」).siblings().css(「color」, 「red」);選擇id為j_liitem的所有兄弟元素

parent()

查詢父元素(親的)
--示例$(「#j_liitem」).parent(「ul」).css(「color」, 「red」);選擇id為j_liitem的父元素

eq(index)

查詢指定元素的第index個元素,index是索引號,從0開始
--示例$(「li」).eq(2).css(「color」, 「red」);選擇所有li元素中的第二個

c str 的用法詳細解析

const char c str c str 函式返回乙個指向正規c字串的指標,內容與本string串相同.c str 就是把string類物件轉換成和c相容的char 型別。這是為了與c語言相容,在c語言中沒有string型別,故必須通過string類物件的成員函式c str 把string 物件...

Jquery的 命名衝突詳細解析

在jquery中,是jquery的別名,所有使用 的地方也都可以使用jquery來替換,如 msg 等同於jquery msg 的寫法。然而,當我們引入多個js庫後,在另外乙個js庫中也定義了 符號的話,那麼我們在使用 符號時就發生了衝突。下面以引入兩個庫檔案jquery.js和prototype....

MySQL limit實際用法的詳細解析

mysql limit的實際用法的詳細解析,在我們使用相關的查詢語句的時候,一般都要返回前幾條或是中間的某幾行資料,這時你應如何處理呢?不必擔心,mysql資料庫已經為我們提供了這樣乙個功能。select from table limit offset,rows rows offset offset...