jQuery操作元素css样式的三种方法
1. addClass() - 添加CSS类
$("#target").addClass("newClass");
//#target 指的是需要添加样式的元素的ID
//newClass 指的是CSS类的名称
2. removeClass() - 移除CSS类
$("#target").removeClass("oldClass");
//#target 指的是需要移除CSS类的元素的ID
//oldClass 指的是CSS类的名称
3. toggleClass() - 添加或者移除CSS类：如果CSS类已经存在，它将被移除；相反，如果CSS类不存在，它将被加上。
$("#target").toggleClass("newClass")
//如果ID为“target”的元素已经定义了CSS样式，它将被移除；
//反之，CSS类”newClass“将被赋给该ID。
在实际运用中，我们常常先定义好这些CSS类，然后通过Javascript事件触发（比如点击某个链接）来改变页面元素样式。此外，jQuery还提供一种方法 hasClass("className")用来判断某个元素是否已经被赋予某个CSS类。
下面是一个完整的例子。
<!DOCTYPE HTML>
<head>
<title>图片闪烁</title>
<style type="text/css">
@-webkit-keyframes twinkling{ /*透明度由0到1*/
0%{
opacity:0; /*透明度为0*/
}
100%{
opacity:1; /*透明度为1*/
}
}
.up{
-webkit-animation: twinkling 1s infinite ease-in-out;
}
</style>
</head>
<body>
<div id="soccer">
哈哈
</div>
<br/>
<input type="button" onclick='btnClick()'>
<script src="./jQuery/jquery-1.8.3.js" type="text/javascript"></script>
<script>
function btnClick(){
//$("#soccer").removeClass("up");
$("#soccer").toggleClass("up");
//$("p:first").removeClass("intro");
}
</script>
</body>
</html>
-
本文向大家介绍JQuery操作元素的css样式，包括了JQuery操作元素的css样式的使用技巧和注意事项，需要的朋友参考一下 我们常常要使用Javascript来改变页面元素的样式。其中一种办法是改变页面元 素的CSS类(Class)，这在传统的Javascript里，我们通常是通过处理HTML Dom的classname特性来实现的；而jQuery里提供三种方法来实现这个功能， 虽然它们和传统
-
本文向大家介绍js改变css样式的三种方法推荐，包括了js改变css样式的三种方法推荐的使用技巧和注意事项，需要的朋友参考一下 共用代码： <div id="div"> this is a div </div> var div=document.getElementById('div'); 第一种：用cssText div.style.cssText='width:250px;height:250
-
本文向大家介绍Jquery搜索父元素操作方法，包括了Jquery搜索父元素操作方法的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了Jquery搜索父元素操作方法。分享给大家供大家参考。具体分析如下： 1. parents()方法 格式: 用于获取当前匹配元素集合中每个元素的祖先元素，根据需要还可以使用一个选择器进行筛选。 如： 2. cloest方法 格式: 该方法从元素本身开始，逐级向上
-
本文向大家介绍jQuery给元素添加样式的方法详解，包括了jQuery给元素添加样式的方法详解的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了jQuery给元素添加样式的方法。分享给大家供大家参考，具体如下： 1、获取和设置样式 2、追加样式 3、移除样式 4、切换类名 5、判断是否含有某项样式 6、获取css样式中的样式 设置单个样式 设置多个样式 7.offset()方法 它的作用是获
-
本文向大家介绍jQuery CSS()方法改变现有的CSS样式，包括了jQuery CSS()方法改变现有的CSS样式的使用技巧和注意事项，需要的朋友参考一下 jQuery入门实例：使用CSS()方法改变现有的CSS样式表，css()方法在使用上具有多样性。其中有一种可接受两个输入参数：样式属性和样式值，两者之间用逗号分隔。比如要改变链接颜色，可以这样编写代码： 如果需要改变多个样式属性，可先定义
-
本文向大家介绍基于jquery animate操作css样式属性小结，包括了基于jquery animate操作css样式属性小结的使用技巧和注意事项，需要的朋友参考一下 昨天突然有网友问我animate()方法可以来操作所有css属性吗？是的，我告诉他可以的。不过，在此有需要注意点需要大家搞清楚：当使用 animate()时，必须使用 Camel 标记法书写所有的属性名，比如，必须使用 padd