- 设置单个属性
css(name,value) ;
或
- 同时设置多个属性
css({name:value, name:value,name:value…}) ;
示例；$(this).css("border","5px solid #f5f5f5");
或
$(this).css({"border":"5px solid #f5f5f5","opacity":"0.5"});
<style>
.dd{ border: 1px solid red; width: 50px; height: 70px;}
</style>
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){
// $("div").css("border","1px solid red");
//$("div").css({"border":"1px solid red","width":"50px","height":"70px"});
$("div").addClass("dd");
});
function show(div1){
alert($(div1).css("border"));
}
</script>
</head>
<body>
<div οnclick="show(this);">
来打我把
</div>
- 追加样式
$(selector).addClass(class);
或 $(selector).addClass(class1 class2 … classN);//多个样式之间是空格
示例:
$("h2").mouseover(function() {
$("p").addClass("content border");
});
- 移除样式
$(selector).removeClass("class") ;
或 $(selector).removeClass("class1 class2 … classN ") ;
示例:
$("h2").mouseout(function() {
$("p").removeClass("text content");
});
- 切换样式
toggleClass()
模拟了addClass()与removeClass()实现样式切换的过程
语法:
$(selector).toggleClass(class) ;
示例:
$("h2").click(function() {
$("p").toggleClass("content border");
});
- 判断是否含指定的样式
hasClass( )方法来判断是否包含指定的样式
语法:
$(selector). hasClass(class);
示例:
$("h2").mouseover(function() {
if(!$("p").hasClass("content ")){
$("p").addClass("content ");
}
});
$("h2").mouseout(function() {
if($("p").hasClass("content ")) {
$("p").removeClass("content ");
}
});
336
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
