對於web developement,我想說說我對於Jquery知識的瞭解和總結。希望對大家有幫助,同時也歡迎大家的評論
簡介:jquery是由美國人John Resig創建, jquery的宗旨是:writer less,do more 對於關於jquery的其它信息可以再www.jquery.com中瞭解
jquery是基於javascript查詢庫, 當然如果你認爲它僅僅能做這種事情的話,那你也就太小看它了,我們通過jquery可以完成許多html的動態效果,能過輕鬆的進行ajax請求等
歷史:jquery是 繼承prototype之後的又一個優秀的javascript框架 輕量級的js庫,擁有強大的兼容性,對於css和大部分瀏覽器都是兼容的,在頁面處理方面,jquery能過
更方便的處理html,document,events,實現動態效果,並可以提供方便的ajax交互,jquery能過很好的使得html代碼分離,從而避免在html中嵌入js的調用
javacript中的五種基本數據類型:undefined,null,boolean,string,number
基本的jquery用法:
typeOf () 驗證關鍵字類型的返回
$(document).ready(function(){
//這裏是jquery的基本,當html的Dom元素加載完畢,但是它們之間的相關聯關係並沒有完成時執行
});
$("a").click(function(){
//當html元素a被觸發click事件的時候執行
});
$("#sharmeId").click(function(){
//當html元素Id名爲sharmeId的元素被觸發click事件的時候執行
});
//添加子元素 ,在這裏注意jquery中html()這個函數有兩個作用,沒有沒有放參數體,那麼就是獲取html()內容,如果放了那麼就是設置內容,這裏是設置Id爲sharmeId的內容
$("#sharmeId").html("
<font color='red'>sharme Yao</font>
");
選擇器的使用:
jquery的每一個對象都有length的屬性
在這裏想和大家說說在html中onload()函數和jquery中ready()函數的區別:
前者表示是html中整個DOM元素都加載完畢,並且他們之間的相關聯的關係也已經完成之後執行,而後者是整個DOM元素加載完畢,但是他們之間的相關聯的關係並沒有加載完畢的時候就已經執行
以下是我對於jquery中的選擇器做了一些篩選之後的內容,希望對於大家使用
基本選擇器:
$("#id") 根據Id找對應的元素,如果不存在返回一個空的jquery對象
$(".class") 更加css的class屬性找對應的元素,返回集合對象
$("p ") 選取所有的P標籤的元素
$(" * ") 找尋所有元素,返回所有元素
$("div,span,p") 將每一個選擇器合併在一起之後返回
層次選擇器:
$("body div").css("background","red"); 將body一下的所有div元素的背景顏色改變
$("body > div").css("background","red");將body的直接子元素的背景顏色改變
$(",one+next").css(....); 將class爲one的下一個元素的樣式進行操作
$("#one ~ div") 獲取ID爲one的,後面所有的兄弟元素的集合
$("#one").next("div").css() ; 尋找到ID爲one,下一個div元素對象
$("#one").nextAll("div").css(); 尋找ID爲one元素之後的所有div元素對象
$("#one").siblings("div").css() 尋找ID爲one的所有的div的兄弟元素
由於時間的原因,下次將和大家更深入的瞭解選擇器和jquery的動畫,如果有哪些不好的地方希望大家提出來,謝謝