jquery學習資料

今天開始看看jquery類庫 這是我接觸的第三個類庫 之前有ext protype。

1. $("#img")=getElementById("img") 酷似CSS的寫法 如下
$("div p"); // 獲取div 裏面 P 標籤
　　$("div.container"); // 獲取class爲container的div標籤
$("div #msg"); // 獲取id爲msg的div標籤
$("table a",context); // 得到context爲上下文的table裏面所有的連接元素。

2.事件：$(document).ready(function(){ });//onload,
hover(fn1,fn2);//onmouseover = fn1 &onmouseout = fn2
toggle(evenFn,oddFn);//onclick = evenFn || oddFn(單擊一次執行第一個方法，再單擊執行第二個方法，如此循環)
trigger(eventtype);//eventtype="click","mousemove"..如$("#msg").trigger("click");
bind(eventtype,fn); //爲某個事件綁定某個方法 $("#msg").bind("click",function(){});
unbind(eventtype)://反綁定 接觸指定的綁定

3.$("div #msg").click //事件機制和html類似
$("div #msg").mousemove
$("div #msg").mouseout
$("div #msg").mouseover //這樣能使js代碼和html代碼完全分離

4.text() text(val)
scrollTop() scrollTop(val)
val() val(val)
html() html(val) //前者未帶參數的爲返回一個值 後者帶參數的爲把值設置爲val

5.js操作css
$("#msg").css("background"); //返回元素的背景顏色
$("#msg").css("background","#ccc") //設定元素背景爲灰色
$("#msg").height(300); $("#msg").width("200"); //設定寬高
$("#msg").css({ color: "red", background: "blue" });//以名值對的形式設定樣式
$("#msg").addClass("select"); //爲元素增加名稱爲select的class
$("#msg").removeClass("select"); //刪除元素名稱爲select的class
$("#msg").toggleClass("select"); //如果存在（不存在）就刪除（添加）名稱爲select的class

6.實用方法：
$.browser.瀏覽器類型：檢測瀏覽器類型。有效參數：safari, opera, msie, mozilla。如檢測是否ie：$.browser.isie，是ie瀏覽器則返回true。
$.each(obj, fn)：通用的迭代函數。可用於近似地迭代對象和數組（代替循環）。