jQuery Study Notes學(xué)習(xí)筆記 (二)
選擇id為"myDivId"的元素.由于id是唯一的,所以總是選擇到1個(gè)或0個(gè)元素
$('#myDivId')
選擇class為"myCssClass". 可以選擇任何多個(gè)class為"myCssClass"的元素.
$('.myCssClass')
獲取或設(shè)置元素的值
var myValue = $('#myDivId').val(); // get the value of an element
$('#myDivId').val("hello world"); // set the value of an element
選擇id中有.和:時(shí),前面添加兩個(gè)反斜杠
// Does not work
$("#some:id")
// Works!
$("#some\\:id")
// Does not work
$("#some.id")
// Works!
$("#some\\.id")
或者用如下處理
function jq(myid) {
return '#' + myid.replace(/(:|\.)/g,'\\$1');
}
$( jq('some.id') )
2. 測(cè)試元素
使用is()方法測(cè)試是否具有某個(gè)class
if ( $('#myDiv').is('.pretty') )
$('#myDiv').show();
測(cè)試是否隱藏
if ( $('#myDiv').is(':hidden') )
$('#myDiv').show();
1.2版本后,可以使用hasClass方法處理
$("div").click(function(){
if ( $(this).hasClass("protected") )
$(this)
.animate({ left: -10 })
.animate({ left: 10 })
.animate({ left: -10 })
.animate({ left: 10 })
.animate({ left: 0 });
});
測(cè)試元素是否存在
if ( $('#myDiv').length )
$('#myDiv').show();
3.元素禁用與允許
// Disable #x
$("#x").attr("disabled","disabled");
// Enable #x
$("#x").removeAttr("disabled");
代碼:
<select id="x" style="width:200px;">
<option>one</option>
<option>two</option>
</select>
<input type="button" value="Disable" onclick="$('#x').attr('disabled','disabled')"/>
<DIV class=cnblogs_Highlighter><PRE class=brush:html> // This doesn't work
$(this).find('li a').eq(2).text().replace('foo','bar');
// This works
var $thirdLink = $(this).find('li a').eq(2);
var linkText = $thirdLink.text().replace('foo','bar');
$thirdLink.text(linkText);
</PRE>
</DIV>
<input type="button" value="Enable" onclick="$('#x').removeAttr('disabled')"/>
4.Checkbox選擇/取消
// Check #x
$("#c").attr("checked", "checked");
// Uncheck #x
$("#c").removeAttr("checked");
代碼:
<label><input type="checkbox" id="c"/> I'll be checked/unchecked.</label><BR><input type="button" value="Check" onclick='$("#c").attr("checked","checked")'/><BR><input type="button" value="Uncheck" onclick='$("#c").removeAttr("checked")'/><BR>
5.獲取Select Opion的value和text
$("select#myselect").val();
$("#myselect option:selected").text();
代碼:
<select id="myselect"><BR> <option value="1">Mr</option><BR> <option value="2">Mrs</option><BR> <option value="3">Ms</option><BR> <option value="4">Dr</option><BR> <option value="5">Prof</option><BR></select><BR><input type="button" value="Get Value" onclick="alert($('#myselect').val())"/><BR><input type="button" value="Get Text Value" onclick="alert($('#myselect option:selected').text())"/>
替換10個(gè)項(xiàng)目中第3個(gè)項(xiàng)目的文本
// This doesn't work
$(this).find('li a').eq(2).text().replace('foo','bar');
// This works
var $thirdLink = $(this).find('li a').eq(2);
var linkText = $thirdLink.text().replace('foo','bar');
$thirdLink.text(linkText);
相關(guān)文章
jquery怎樣實(shí)現(xiàn)ajax聯(lián)動(dòng)框(二)
ajax聯(lián)動(dòng)框想必大家早有所耳聞,接下來將介紹jquery實(shí)現(xiàn)另一種形式的聯(lián)動(dòng)框,右邊的聯(lián)動(dòng)框用jquery生成,仿照上篇的js方法修改的,感興趣的你可以參考下希望可以幫助到你2013-03-03jQuery選擇器_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
選擇器是jQuery的核心,一個(gè)選擇器寫出來類似$('#dom-id')。下面給大家分享jQuery選擇器的相關(guān)知識(shí),感興趣的朋友一起看看吧2017-07-07基于jQuery倒計(jì)時(shí)插件實(shí)現(xiàn)團(tuán)購(gòu)秒殺效果
倒計(jì)時(shí)在WEB上應(yīng)用非常廣泛,如考試系統(tǒng)倒計(jì)時(shí),團(tuán)購(gòu)網(wǎng)站中的優(yōu)惠活動(dòng)倒計(jì)時(shí)等等。今天,我們來使用jQuery倒計(jì)時(shí)超級(jí)實(shí)現(xiàn)團(tuán)購(gòu)秒殺效果,感興趣的朋友一起學(xué)習(xí)吧2016-05-05jQuery.fn和jQuery.prototype區(qū)別介紹
jQuery.fn和jQuery.prototype想必大家對(duì)它并不陌生吧,那么你們知道它們之間的區(qū)別嗎?在本文有個(gè)不錯(cuò)的示例大家可以參考下2013-10-10解決jquery validate 驗(yàn)證不通過后驗(yàn)證正確的信息仍殘留在label上的方法
在本篇文章里小編給大家整理了關(guān)于解決jquery validate 驗(yàn)證不通過后驗(yàn)證正確的信息仍殘留在label上的方法,有需要的朋友們可以學(xué)習(xí)下。2019-08-08方便實(shí)用的jQuery checkbox復(fù)選框全選功能簡(jiǎn)單實(shí)例
這篇文章介紹了jQuery checkbox復(fù)選框全選功能的代碼實(shí)例,有需要的朋友可以參考一下2013-10-10jQuery移除tr無效的解決方法(tr是動(dòng)態(tài)添加)
移除掉某些tr(tr是動(dòng)態(tài)添加的)嘗試了很多方法,都不見效,后來發(fā)現(xiàn)個(gè)不錯(cuò)的方法,于是與大家分享下2014-09-09