Jquery操作手冊Jquery簡介?

青岡網(wǎng)站建設(shè)公司創(chuàng)新互聯(lián)建站,青岡網(wǎng)站設(shè)計(jì)制作，有大型網(wǎng)站制作公司豐富經(jīng)驗(yàn)。已為青岡近千家提供企業(yè)網(wǎng)站建設(shè)服務(wù)。企業(yè)網(wǎng)站搭建\成都外貿(mào)網(wǎng)站制作要多少錢，請找那個(gè)售后服務(wù)好的青岡做網(wǎng)站的公司定做！

1. 什么是jquery?

   1. 

是一個(gè)javaScript函數(shù)庫。其實(shí)就是javascript庫，由javascript寫的函數(shù)封裝成一個(gè)庫。

2. jQuery是一個(gè)JavaScript函數(shù)庫。

3. jQuery是一個(gè)輕量級的"寫的少，做的多"的JavaScript庫。

4. jquery包括以下功能

       1. 

   html元素選取

   2. html元素操作

   3. css操作

   4. html事件函數(shù)

   5. javascript特效和動(dòng)畫

   6. html DOM遍歷和修改

   7. AJAX(異步請求交互)

Utilities

并且在此基礎(chǔ)之上，還有提供了大量的插件。

1. 

為什么要學(xué)習(xí)jquery呢？

    1. 

Jquery是目前最流行的js框架，許多大公司都在使用

比如IBM,Google,Microsoft

Jquery比javaScript的優(yōu)點(diǎn)

    1. 

Jquery極大地簡化了javascript編程。

Jquery要比javascript更容易學(xué)習(xí)。

Jquery學(xué)習(xí)基礎(chǔ)

    1. 

在學(xué)jquery之前需要學(xué)習(xí)人員具體以下知識：

        1. 

HTML

CSS

JS(javascript)

Jquery 的安裝

因?yàn)閖query是一個(gè)javascript庫，所以可以像引入js一樣引入到一個(gè)html文件內(nèi)

用一個(gè)標(biāo)簽將jquery文件引入

    1. 

<script src=”jquery.xxxxxx.js” type=”text/javascript”></script>

提示： 將下載的文件放在網(wǎng)頁的同一目錄下，就可以使用jQuery。
您是否很疑惑為什么我們沒有在 <script> 標(biāo)簽中使用 type="text/javascript" ？
在 HTML5 中，不必那樣做了。JavaScript 是 HTML5 以及所有現(xiàn)代瀏覽器中的默認(rèn)腳本語言！

Jquery語法
jQuery 語法是通過選取 HTML 元素，并對選取的元素執(zhí)行某些操作。

基礎(chǔ)語法：$(selector).action()

    1. 

美元符是定義使用jquery的。

selector是要查詢或者要操作的html元素

action()是對選擇的元素要進(jìn)行的操作

        1. 

比如：$(“div”).hide() à表示隱藏所有的div元素

1. 

Jquery語法的書寫區(qū)域

    1. 

在head標(biāo)簽內(nèi)的script標(biāo)簽內(nèi)

$(document).ready(function(){
// 開始寫 jQuery 代碼...
});
$(document).ready();表示整個(gè)文檔加載完成后才執(zhí)行該代碼，為了防止文檔在加載前就執(zhí)行jquery代碼。

Jquery選擇器

Jquery選擇器允許你對html元素組或者單個(gè)元素進(jìn)行操作

Jquery選擇器基于元素的ID、類、類型、屬性、屬性值等查找html元素。

但是請記住jquery中所有選擇器都以美元符開頭：$()

一些基本的元素選擇器：元素選擇器

其實(shí)就是選擇一些html元素標(biāo)簽組件

比如

    1. 

$("p")

該句話的意思是在頁面中選取所有的<p>元素

實(shí)例：

#id 選擇器

jQuery #id 選擇器通過 HTML 元素的 id 屬性選取指定的元素。

頁面中元素的 id 應(yīng)該是唯一的，所以您要在頁面中選取唯一的元素需要通過 #id 選擇器。
通過 id 選取元素語法如下：
$("#test")
實(shí)例：

class 選擇器

jQuery 類選擇器可以通過指定的 class 查找元素。

語法如下：
$(".test")
實(shí)例：
其他的一些選擇器

事件

Jquery中的其他事件

Event函數(shù)
綁定的函數(shù)功能
$(document).ready(function);
將函數(shù)綁定到文件的就緒事件（文檔加載完成）
$(selector).click(function);
將函數(shù)綁定到點(diǎn)擊或者單擊事件
$(selector).dbclick(function);
將函數(shù)綁定到雙擊事件
$(selector).focus(function);
將事件綁定到獲得的焦點(diǎn)的事件中
$(selector).blur(function);
將事件綁定到失去的焦點(diǎn)的事件中。
$(selector).toggle(function);
將組件的屬性轉(zhuǎn)換為隱藏或者顯示狀態(tài)
$(selector).mouseover(function);
將函數(shù)綁定到備選元素的的鼠標(biāo)懸停事件。(其實(shí)就是hide方法和show方法的互相切換)

Switch描述：

Jquery效果淡入淡出fade
fadeIn()\fadeOut()\fadeToggle()\fadeTo()

FadeIn()是將某個(gè)元素淡入為顯示狀態(tài)

    1. 

格式：fadeIn(speed,callback)

        1. 

通?？梢匀≈禐椋篺ast,slow,毫秒值或者默認(rèn)不寫

其中speed是速度，callback是執(zhí)行淡入后的所執(zhí)行的其他函數(shù)或者函數(shù)名

相同道理fadeOut也是相同的道理

    1. 

將組件的顯示狀態(tài)更改為隱藏狀態(tài)

fadeToggle

    1. 

該fadeToggle可以在每次點(diǎn)擊后在fadeIn與fadeOut的效果之間進(jìn)行切換。

fadeTo

    1. 

格式fadeTo(speed,opacity,callback)

該函數(shù)允許漸變?yōu)榻o定的不透明度（0~1之間）

滑動(dòng)

slideUp()

    1. 

這個(gè)方法用于向上滑動(dòng)元素

語法：$(selector).slideUp(speed,callback);

        1. 

可選的speed參數(shù)規(guī)定效果的時(shí)長。它可以取一下值：“slow”,”fast”,或者一些毫秒值

可選的callback是在向上滑動(dòng)后所執(zhí)行的函數(shù)的名稱。

slideDown();

    1. 

這個(gè)方法用于向下滑動(dòng)元素

語法：$(selector).slideDown(speed,callback);

slideToggle();

    1. 

語法：$(selector).slideToggle(speed,callback);

動(dòng)畫

animate();

    1. 

語法：$(selector).animate({params},speed,callback());

        1. 

{params}：表示要設(shè)置的一些參數(shù)

speed表示執(zhí)行該動(dòng)畫所需的時(shí)間

callback（）表示執(zhí)行該動(dòng)畫后所執(zhí)行其他的函數(shù)或者方法。

Ajax簡單請求Servlet

Ajax:Asynchronous javascript and xml

    1. 

全稱叫做異步j(luò)s和xml技術(shù)：其實(shí)就是異步交互技術(shù)

Ajax 是一種用于創(chuàng)建快速動(dòng)態(tài)網(wǎng)頁的技術(shù)。

作用：通過在后臺(tái)與服務(wù)器進(jìn)行少量的數(shù)據(jù)交換，Ajax可以實(shí)現(xiàn)異步更新。這意味著可以在不全部更新頁面的情況下只更新部分頁面。比如傳統(tǒng)的頁面點(diǎn)擊一個(gè)按鈕要更新整個(gè)頁面這導(dǎo)致了有的不需要更新部分也更新了，就有點(diǎn)浪費(fèi)流量數(shù)據(jù)了，所有用了Ajax技術(shù)后只需要更新要更新的部分即可。

使用注意：在使用Ajax技術(shù)前先需要導(dǎo)入jquery.xxx.js

格式：

        1. 

    6. 

Ajax異步請求servlet實(shí)例：

        1. 

Html代碼

            1. 

        2. 

服務(wù)器代碼

            1. 

        3. 

結(jié)果：

            1. 

點(diǎn)擊box text會(huì)彈出框

并在box text下方顯示hello

4.     4. 

網(wǎng)頁名稱：jquery操作手冊
分享鏈接：http://jinyejixie.com/article32/iihdsc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供建站公司、電子商務(wù)、小程序開發(fā)、App開發(fā)、網(wǎng)頁設(shè)計(jì)公司、移動(dòng)網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)