jQuery操作样式

/* 获取样式 --- 获取id为s的标签的color值 */
$(document).ready(function(){
$("#hqys").click(function(){
alert($("#s").css("color"));
});
});

/* 添加样式 --- 设置id为s的标签的样式：颜色为红色*/
$(document).ready(function(){
$("#szys").click(function(){
$("#s").css("color","red");
});
});

$(document).ready(function(){
$("#py").click(function(){
//$("#s").css("color");//获取样式(color:属性)
//$("#s").css("color","red");//添加样式(red:属性值)

//var tops = $("#s").offset().top;//元素据上边框的距离
//var lefts = $("#s").offset().left;//元素据左边框的距离
//var rights = $("#s").offset().right;//元素据右边框的距离
//var bottoms = $("#s").offset().bottom;//元素据下边框的距离

//var widths = $("#s").width();//获的元素的宽度
//var heights = $("#s").height();//获得元素的高度
//$("#s").width(500);//设置元素的宽度
//$("#s").height(500);//设置元素的宽度

//var htmls = $("#s").html();//获取某个元素下的所有子元素(包含标签名)
//$("#s").html("这是一段文字，<b>这里是粗体</b>");//设置某个元素下的内容

//var texts = $("#s").text();//获取某个元素下的所有子元素(不包含标签名)
//$("#s").text("这是一段文字，这里是粗体");//设置某个元素下的内容

//$("#s").val();//获取某个元素下的值
//$("#s").val("name");//获取某个元素下的值

/*过滤元素*/
//$("div").filter(".first").css("background-color","green");//过滤元素

/*$("div").filter(function(){
return $(this).hasClass("first") ? "first" : ""
}).css("background-color","green");//过滤元素(事件)*/

/*$("div").each(function(){
if($(this).hasClass("first")){
$(this).css("background-color","green");
}
});*/

/*$("div").each(function(){
if(!$(this).is(".first")){
$(this).css("background-color","green");
}
});*/

/*$("div").not(".first").css("background-color","green");*/

/*$("div").find("#first").addClass("color");//事先在css定义color*/

/*$("div").filter("#first").addClass("color");//事先在css定义color*/

/*$("div").next().addClass("color");//事先在css定义color*/

/*$("div").nextAll("#city").addClass("color");//事先在css定义color*/
});
});