jQuery基本選擇器
什麼是選擇器
在頁(yè)面上取得各種元素節(jié)點(diǎn)物件而使用的條件就是選擇器。
document.getElementById()
document.getElementsByTagName();
document.getElementsByName();
?基本選擇器
$('#id屬性值') ?----------->document.getElementById()
$('tag標(biāo)籤名稱')----------->document.getElementsByTagName();
$('. class屬性值') class屬性值選擇器
$('*') ????通配符選擇器
$('s1,s2, s3')聯(lián)合選擇器
<!DOCTYPE html>
<html>
<head>
<title>php.cn</title>
<meta charset="utf-8" />
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
function f1(){
//① $('#id屬性值')
$('#username').css('color','red');
//② $('tag標(biāo)簽名稱')tag標(biāo)簽選擇器
$('input').css('background-color','blue');
//③ $('.class屬性值') class類別選擇器
$('.apple').css('background-color','green');
//④ $('*') 通配符選擇器
//$('*').css('background-color','gray');
//⑤ $('s1,s2,s3...')聯(lián)合選擇器selector
$('p,#username,.apple').css('font-size','25px');
}
</script>
<style type="text/css">
#username{}
p{}
.apple{}
*{}
.apple,span,input{} /*聯(lián)合選擇器*/
</style>
</head>
<body>
<h2>基本選擇器(靈感來(lái)源于css樣式選擇器)</h2>
<input type="text" name="username" value="php中文網(wǎng)" id="username" /><br />
<p>大家好</p>
<div class="apple">歡迎來(lái)到php中文網(wǎng)</div>
<span>讓我們一起開(kāi)始學(xué)習(xí)jQuery吧</span><br />
<input type="button" value="觸發(fā)" onclick="f1()" />
</body>
</html> 
