Jquery中常用的方法
1.Window.onload 的JQuery方法
$(document).ready(function(){
//The Code!
})
可以簡寫為:
$(function(){
//The Code!
})
2.添加和去除Css類
$(function(){
$(“a.alink”).mouseover(function(){
this.addClass(“over”); //添加樣式
}).mouseout(function(){
this.removeClass(“over”); //去除樣式
})
})
3.動態切換樣式
$funciotn(){
$(a.alink).click(function(){
This.toggleClass(“highline”); //動態切換,當有時去除,當沒有時添加
})
}
4.給表格的偶數行添加樣式
$(".mytable tr:even").addClass("tr1");
5.在選中元素上添加內容
如:$("p ").wrap(“<div class=’aa’></div >”);
原代碼:<p>測試</p>
運行后效果: <div class=’aa’><p>測試</p></div >
6.直接獲取、編輯內容
var sString = $(“p:frist”).text(); //獲取第一個P標簽的文本值
$(“p:last”).html(sString); //把值賦給最后一個P標簽，以Html形式賦給，也就是說可以包含Html標簽
7.頁面元素有克隆
$(“img.eq(1)”).clone().appendTo($(“p”)); //將第一個圖片克隆到所有的P標簽中
8.事件的監聽
$(“img”)
.bind (“click”,fnMyfun1=function(){ //添加事件1
$(“#show”).append(“事件1”); //在id為show的標簽中添加文本
})
.bind (“click”,fnMyfun2=function(){//添加事件2
$(“#show”).append(“事件2”);
})
.bind (“click”,fnMyfun3=function(){//添加事件3
$(“#show”).append(“事件3”);
}) //可以同時添加多個事件
9.移除監聽的事件
$(“input(type=button)”).click(function(){
$(“img”).unbind(“click”,” fnMyfun1”); //移除事件監聽fnMyfun1
})
10.JQuery制作動畫與特效――元素的顯示與隱藏效果
$(“img”).hide();
$(“img”).hide(3000); //設置漸隱的時間，單位毫秒
$(“img”).show ();
$(“img”).show (3000);
還有更多特效如：fadeIn() fadeout() slideUp() slideDown()
11.JQuery的功能慮數
·瀏覽器的檢測
用$.browser方法
$.browser.verson //獲取瀏覽器版本號
function detect(){
if($.browser.msie)
return “IE”;
if($.browser.mozilla)
return “Mozilla”;
if($.browser.safari)
return “Safari”;
if($.browser.opera)
return “Opera”;
}
12.盒子模型類型
$.boxModel 如果是True，則是標準W3C，False則是其他。
13. $.each遍歷
var aArray = [“sdf”,”dasd”,”dsa”]; //數組
$.each(aArray,function(iNum,value){
document.write(“序號：”+iNum+” 值：”+value);
});
var oObj = {one:1,two:2,three:3};
$.each(aArray,function(property,value){
document.write(“屬性：”+ property +” 值：”+value);
});
14.數據過慮
var aArray = [1,3,5,6,7,8,6,8];
var aResulr = $.grep(aArray,function(){
return value > 4; //返回大于4的值，過慮了小于等于4的值
});
15.數組的轉換
var aArray = [“a”,”b”,”c”,”d”];
aArray = $.map(aArray,function(value,index){
return (value.toUpperCase()+index);
});
16.JQuery中使用Ajax
$(“#display”).load(“aaa.aspx”); //display為接收數據的容器
$.get(url,[data],[callback]) //get方式
$.post(url,[data],[callback],[type]) //post方式
例：
function createQuerystring()
{
var username = encodeURI($(“#userName”).val); //userName為文本框的id
var password = encodeURI($(“#passWord”).val);
var queryString = {username:username, password:passWord};
return queryString;
}
$.get(“aa.aspx”, createQuerystring(), function(data){
$(“#serverResponse”).html(decodeURI(data));
});
Ajax 細節設置
$.ajax({
type : ”GET”,
url : “aa.aspx”,
data : createQuerystring(),
success : function(data){
$(“#serverResponse”).html(decodeURI(data));
}
})
Ajax全局設置
$.ajaxSetup({
url : “aa.aspx”,
data : createQuerystring(),
success : function(data){
$(“#serverResponse”).html(decodeURI(data));
}
}) //這個設置后，就成為了Ajax的默認設置
openkk 
openkk1 
ajax 
ivy