JQuery必備基礎(chǔ)知識(shí)（一）

jQuery

1.1 初認(rèn)識(shí)

作用相當(dāng)于onload事件,等dom結(jié)構(gòu)渲染完畢即可執(zhí)行

但又有所不同

onload 事件是等頁(yè)面文檔、外部的 js 文件、css文件、圖片加載完畢才執(zhí)行內(nèi)部代碼。

// 第一種 $(function () { ... // 內(nèi)容 }) ; // 第二種 $(document).ready(function(){ ... // 內(nèi)容 });

可以用jQuery來(lái)代替，相當(dāng)于原生js中的window

用原生 JS 獲取來(lái)的對(duì)象是 DOM 對(duì)象

jQuery 方法獲取的元素是 jQuery 對(duì)象。

jQuery 對(duì)象是經(jīng)過(guò)包裝的dom對(duì)象（偽數(shù)組形式存儲(chǔ)）

jQuery對(duì)象才能使用jQuery方法,不能混用

// DOM對(duì)象轉(zhuǎn)換成jQuery對(duì)象 var box = document.getElementById('box'); // 獲取DOM對(duì)象 var jQueryObject = $(box); // 把DOM對(duì)象轉(zhuǎn)換為 jQuery 對(duì)象 // jQuery 對(duì)象轉(zhuǎn)換為 DOM 對(duì)象兩種方法： // jQuery對(duì)象[索引值] var domObject1 = $('div')[0] // jQuery對(duì)象.get(索引值) var domObject2 = $('div').get(0)

2.1 jQuery選擇器

2.2 基礎(chǔ)知識(shí)

$(this).css(“color”,”red”);//自己變色 $(this).siblings(). css(“color”,””);//兄弟除色

在jQuery內(nèi)部會(huì)遍歷dom對(duì)象的過(guò)程叫做隱式迭代

$('div').hide(); //頁(yè)面中所有的div都會(huì)被隱藏

$(this).css('color', 'red').sibling().css('color', '');

3.1 樣式操作

var strColor = $(this).css('color'); $(this).css(''color'', ''red''); //參數(shù)可以是對(duì)象形式，方便設(shè)置多組樣式。屬性名和屬性值用冒號(hào)隔開(kāi)， 屬性可以不用加引號(hào) $(this).css({ "color":"white","font-size":"20px"});

一般來(lái)說(shuō)通過(guò)在style中編寫(xiě)樣式，通過(guò)添加類(lèi)的方式添加樣式

// 1.添加類(lèi) $("div").addClass("current"); // 2.刪除類(lèi) $("div").removeClass("current"); // 3.切換類(lèi) $("div").toggleClass("current");

在原生js中className會(huì)覆蓋類(lèi)名，在jQuery中指操作指定類(lèi)名，不影響原先的類(lèi)名

jQuery jQuery UI

版權(quán)聲明：本文內(nèi)容由網(wǎng)絡(luò)用戶(hù)投稿，版權(quán)歸原作者所有，本站不擁有其著作權(quán)，亦不承擔(dān)相應(yīng)法律責(zé)任。如果您發(fā)現(xiàn)本站中有涉嫌抄襲或描述失實(shí)的內(nèi)容，請(qǐng)聯(lián)系我們jiasou666@gmail.com 處理，核實(shí)后本網(wǎng)站將在24小時(shí)內(nèi)刪除侵權(quán)內(nèi)容。