一、jQuery概述
jQuery是目前最流行的JavaScript程序库,它是对JavaScript对象和函数的封装
jQuery能做什么
访问和操作DOM元素
控制页面样式
对页面事件进行处理 扩展新的jQuery插件
与Ajax技术完美结合
1、jQuery的引入
<script type="text/javascript" src="js/jquery.js"></script>
2、jQuery的启动
$(function(){
代码段;
....
});
3、使用jQuery获取标签元素对象
(1)根据标签名称获取标签对象
$("标签名称")
(2)根据标签id属性值获取标签对象
1)$("#标签的id属性值").css('属性','值'); //设置样式
2)
$("#标签的id属性值").click(function(){ //直接绑定事件方法
...
});
3)使用clss样式表改变属性
.myclass {
position: absolute;
width: 200px;
height: 233px;
z-index: 1;
left: 16px;
top: 101px;
background-color:#FFF;
}
$(".myclass").css('background-color','#CF9');
4)获取或者设置标签的属性
a、设置单个属性的值
$("#标签的id属性值").attr("属性名","值");
b、设置多个属性的值
$("#标签的id属性值").attr({"属性名1":"值1","属性名2":"值2",...,"属性名n":"值n"});
//获取属性值
var xx=$("#标签的id属性值").attr("属性名");
c、获取标签元素的文本内容
var 变量=$("#标签的id属性值").text();
或者
var 变量=$("#标签的id属性值").html();
设置标签元素的文本内容
$("#标签的id属性值").text("内容");
或者
$("#标签的id属性值").html("内容");
5)获取标签元素的个数
var size=$("标签元素").length;
或者
var size=$("标签元素").size();
6)标签对象的循环处理
$("标签名").each(function(index, element) {
var 变量 = $(this).attr("属性");
});
jQuery基本选择器
jQuery层次选择器
jQuery属性选择器
基本过滤选择器
可见性过滤选择器