读书人

Juery1、根本选择器

发布时间: 2013-04-02 12:35:26 作者: rapoo

Juery1、基本选择器

1、基本选择器

(1)、根据id匹配元素 id

(2)、根据给定的类名匹配元素 class

(3)、 根据给定的元素名称匹配元素 例如<p></p>

(4)、*匹配所有的元素(通配符)

(5)、集合元素,将每个选择器匹配的元素合并后一起返回。

批量给元素绑定事件

<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="./script/jquery-1.4.2.min.js"></script>
<script>
$(document).ready(function(){
//第一步,找到所有的p元素,jquery中的事件名称没有on
$("p").click(function(){alert('hello')});
});
</script>
</head>
<body>
<p>这是第一个p</p>
<p>这是第二个p</p>
<p>这是第三个p</p>
<p>这是第四个p</p>
<p>这是第五个p</p>
<p>这是第六个p</p>
</body>

</html>

jquery实现表格各行换色

<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="./script/jquery-1.4.2.min.js"></script>
<script>
$(document).ready(function(){
$("#tab tr:even").css("background","blue");//根据id属性找到table下的tr的偶数行设置css样式背景颜色为:blue。
});
</script>
</head>
<body>
<table id="tab">
<tr><td>第一行</td><td>第一行</td></tr>
<tr><td>第二行</td><td>第二行</td></tr>
<tr><td>第三行</td><td>第三行</td></tr>
<tr><td>第四行 </td><td>第四行 </td></tr>
<tr><td>第五行</td><td>第五行</td></tr>
<tr><td>第六行</td><td>第六行</td></tr>
</table>
</body>

</html>





读书人网 >编程

热点推荐