jQuery 元素选择器
jQuery 使用 CSS 选择器来选取 HTML 元素。
$(“p”) 选取 <p> 元素。
$(“p.intro”) 选取所有 class=”intro” 的 <p> 元素。
$(“p#demo”) 选取所有 id=”demo” 的 <p> 元素。
示例代码:
jquery 部分
$(document).ready(function(){//页面加载完成后执行
tagName();
// idName();
// className();
});function tagName(){
$('p').addClass('heighlight');
}
function idName(){
$('#div').addClass('heighlight2');
}
function className(){
$('p.pClass').addClass('heighlight2');
}
html部分
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script type="text/javascript" src="js/jquery.js" ></script>
<script type="text/javascript" src="js/select.js" ></script>
<link rel="stylesheet" href="css/select.css" />
</head>
<body>
<div id="div">
<p>this is my name!!</p>
<p class="pClass">class is import!</p>
<a href="#">you cai!!</a>
</div>
</body>
</html>
css部分
.heighlight {
background-color: blue;}
.heighlight2 {
background-color: red;
}
.alt{
background-color:#ccc;
}
jQuery 属性选择器
Query 使用 XPath 表达式来选择带有给定属性的元素。
$(“[href]”) 选取所有带有 href 属性的元素。
$(“[href=’#’]”) 选取所有带有 href 值等于 “#” 的元素。
$(“[href!=’#’]”) 选取所有带有 href 值不等于 “#” 的元素。
$(“[href$=’.jpg’]”) 选取所有 href 值以 “.jpg” 结尾的元素。
jquery部分,其他部分同上。
$(document).ready(function(){
attribute();
});function attribute(){
$('[href="#"]').addClass('heighlight');
}
jQuery CSS 选择器
.addClass()或者是.css()
$(document).ready(function(){
cssName();
});function cssName(){
$('p').css("background-color","pink");
}
jQuery 自定义选择符
$(document).ready(function(){
custom();
});function custom(){
$('tr:odd').addClass('alt');
}










