【Java基礎(chǔ)】JQuery的常用操作

jQuery的常用操作

網(wǎng)站的建設(shè)創(chuàng)新互聯(lián)專注網(wǎng)站定制,經(jīng)驗(yàn)豐富,不做模板,主營(yíng)網(wǎng)站定制開(kāi)發(fā).小程序定制開(kāi)發(fā),H5頁(yè)面制作!給你煥然一新的設(shè)計(jì)體驗(yàn)!已為小攪拌車等企業(yè)提供專業(yè)服務(wù)。

一、隱藏顯示對(duì)象

 id為test的元素的display修改成了“none”，即隱藏了id為test的元素：

$('#test').css('display','none')

或

$('#test').style.display="none"

 我們經(jīng)常用到的是切換一個(gè)元素的隱藏與現(xiàn)實(shí)，下面給出代碼：

var show = $('#test').css('display');//獲取id為test的元素的display的值
$('#test').css('display',show =='block'?'none':show);//通過(guò)三目運(yùn)算

二、點(diǎn)擊事件 - click() 方法

$("button").click(function(){
});

三、操作元素的樣式

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

四、操作元素的VALUE

$("input").val(); //返回表單輸入框的value值 
$("input").val("test"); //將表單輸入框的value值設(shè)為test
$("input").val(""); //將表單輸入框的value清空

五、集合處理功能 

對(duì)于jquery返回的集合內(nèi)容無(wú)需我們自己循環(huán)遍歷并對(duì)每個(gè)對(duì)象分別做處理，jquery已經(jīng)為我們提供的很方便的方法進(jìn)行集合的處理。 

包括兩種形式： 

$("p").each(function(i){this.style.color=['#f00','#0f0','#00f'][i]}) 
//為索引分別為0，1，2的p元素分別設(shè)定不同的字體顏色。 
$("tr").each(function(i){this.style.backgroundColor=['#ccc','#fff'][i%2]}) 
//實(shí)現(xiàn)表格的隔行換色效果 
$("p").click(function(){alert($(this).html())})

//為每個(gè)p元素增加了click事件，單擊某個(gè)p元素則彈出其內(nèi)容

六、擴(kuò)展我們需要的功能 

擴(kuò)展自己想要的功能，如擴(kuò)展輸入兩個(gè)參數(shù)，獲取它們的最大值和最小值

$.extend({ 
min: function(a, b){return a < b?a:b; }, 
max: function(a, b){return a > b?a:b; } 
}); //為jquery擴(kuò)展了min,max兩個(gè)方法 ，通過(guò)“$.方法名”調(diào)用： 
alert("a=10,b=20,max="+$.max(10,20)+",min="+$.min(10,20));

七、支持方法的連寫(xiě) 

所謂連寫(xiě)，即可以對(duì)一個(gè)jquery對(duì)象連續(xù)調(diào)用各種不同的方法。 

例如： 

$("#test").click(function(){alert($(this).html())}) 
.mouseover(function(){alert('mouse over event')}) 
.each(function(i){this.style.color=['#f00','#0f0','#00f'][i]});

為元素id為test的添加三個(gè)方法，分別是click()、mouseover()、each()

網(wǎng)站題目：【Java基礎(chǔ)】JQuery的常用操作
本文路徑：http://muchs.cn/article0/ihccio.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供虛擬主機(jī)、電子商務(wù)、網(wǎng)站收錄、品牌網(wǎng)站制作、外貿(mào)網(wǎng)站建設(shè)、標(biāo)簽優(yōu)化

廣告

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