jQuery 簡介

jQuery 是一個 JavaScript 庫,它極大地簡化了 JavaScript 編程。

一、jQuery 庫包含如下特性:jquery

  • HTML 元素選取
  • HTML 元素操做
  • CSS 操做
  • HTML 事件函數
  • JavaScript 特效和動畫
  • HTML DOM 遍歷和修改
  • AJAX
  • Utilities

二、如何向您的頁面添加 jQuery 庫?

如需使用 jQuery,您須要下載 jQuery 庫,而後把它包含在但願使用的網頁中。
下載jQuery:http://jquery.com/download/編程

 

jQuery 庫是一個 JavaScript 文件,您能夠使用 HTML 的 <script> 標籤引用它:ide

<head>
<script src=".../jquery.js"></script>
</head>

三、jQuery 語法函數

jQuery 語法是爲 HTML 元素的選取編制的,能夠對元素執行某些操做。動畫

 

基礎語法是:$(selector).action();this

  • 美圓符號定義 jQuery
  • 選擇符(selector)「查詢」和「查找」 HTML 元素
  • jQuery 的 action() 執行對元素的操做
示例:
$(this).hide(); // 隱藏當前元素
$("p").hide(); // 隱藏全部段落
$(".test").hide(); // 隱藏全部 class="test" 的全部元素
$("#test").hide(); // 隱藏全部 id="test" 的元素

 四、jQuery選擇器spa

jQuery選擇器分元素選擇器和屬性選擇器,容許經過標籤名、屬性名或內容對 HTML 元素進行選擇。code

 

(1)jQuery 元素選擇器blog

jQuery 使用 CSS 選擇器來選取 HTML 元素。事件

$("p");     //選取 <p> 元素。
$("p.intro");     //選取全部 class="intro" 的 <p> 元素。
$("p#demo");     //選取全部 id="demo" 的 <p> 元素。

 (2)jQuery 屬性選擇器

jQuery 使用 XPath 表達式來選擇帶有給定屬性的元素。

$("[href]");     //選取全部帶有 href 屬性的元素。
$("[href='#']");     //選取全部帶有 href 值等於 "#" 的元素。
$("[href!='#']");      //選取全部帶有 href 值不等於 "#" 的元素。
$("[href$='.jpg']");     //選取全部 href 值以 ".jpg" 結尾的元素。

更多的選擇器實例:

$(this);         //當前 HTML 元素
$("p");                 //全部 <p> 元素
$("p.intro");         //全部 class="intro" 的 <p> 元素
$(".intro");         //全部 class="intro" 的元素
$("#intro");         //id="intro" 的元素
$("ul li:first");    //每一個 <ul> 的第一個 <li> 元素
$("[href$='.jpg']"); //全部帶有以 ".jpg" 結尾的屬性值的 href 屬性
$("div#intro .head");//id="intro" 的 <div> 元素中的全部 class="head" 的元素

轉載自本人ITeye連接:http://xiaozhuang0706.iteye.com/blog/2255546

相關文章
相關標籤/搜索