CSS样式修改：
jQuery中还有一些方法直接返回或者设置元素的CSS属性。
css()：
读 *** 作: 获取匹配元素集合中第一个元素的指定样式值(一个或多个)。
注:读取多个样式值的 *** 作是在jQuery v19才加入的。
写 *** 作: 为匹配元素集合中的每一个元素设置一个或多个CSS属性的值。
传入的参数可以是单个的键值对，也可以是PlainObject指定的多个值，还可以是function(v14)。
jQuery会处理各个浏览器中不太相同的一些具体情况，比如W3C的cssFloat在IE中是styleFloat，在jQuery中，你可以使用float，然后jQuery会帮你把它翻译成每个浏览器中应该有的正确名称。
还有，jQuery会合理解读CSS和DOM格式的多词属性，比如css(“background-color”)和css(“backgroundColor”)，它都是可以处理的。
jquery改变CSS背景图修改方法
如果需要使用Jquery修改CSS网页背景样式。用户可以这样写$(‘p’)css({"background-image":"url(/images/msg_btngif"});
Jquery-CSS用法css() 方法返回或设置匹配的元素的一个或多个样式属性。返回第一个匹配元素的 CSS 属性值。注释：当用于返回一个值时，不支持简写的 CSS 属性（比如 "background" 和 "border"）。
参考资料：
把上面的
$(this)css("animation","running");
改成
$(this)css("animation-play-state","running");
试一下
你确定你测试的浏览器兼容animation样式吗
还有你有微animation写@keyframes吗
jquery获取style的属性值有两种方法
第一种是getElementById() 方法。它可以返回对拥有指定 ID 的第一个对象的引用。在 *** 作文档的一个特定的元素时，最好给该元素一个 id 属性，为它指定一个（在文档中）唯一的名称，然后就可以用该 ID 查找想要的元素。
第二种是getElementsByName() 方法，它可以返回带有指定名称的对象的集合。该方法与getElementById() 方法相似，但是它查询元素的 name 属性，而不是 id 属性。另外，因为一个文档中的 name 属性可能不唯一（如 HTML 表单中的单选按钮通常具有相同的 name 属性），所有 getElementsByName() 方法返回的是元素的数组，而不是一个元素。
jquery获取对象的css属性值的时候，就算我们没有给这个对象设置过css属性值，这些值也会存在，只不过有些是默认值。下面我们来输出一个div的css属性值，原始代码如下
<!DOCTYPE html><html>
<head>
<title>DIV_TEST</title>
<meta charset="utf-8"/>
<style type="text/css">
#top1{
}
</style>
</head>
<body>
<div id="top1">
<u>你好我是某某某</u>
</div>
<script src="jquery-321minjs" ></script>
<script>
$(document)ready(function(){
consolelog("float的值是："+$("#top1")css("float"));
consolelog("height的值是："+$("#top1")css("height"));
consolelog("overflow的值是："+$("#top1")css("overflow"));
consolelog("color的值是："+$("#top1")css("color"));
consolelog("big的值是："+$("#top1")css("big"));
});
</script>
</body>
</html>
结果如下
可以看到我们没有设置过div的css属性，除了高度以外剩下的只要存在这个css属性的都是默认值，唯一不同的是最后一个big属性，我们知道这个属性不是css的属性，因此我们判断有没有某个属性的时候可以通过这个方式判断
$(document)ready(function(){consolelog("是否存在big属性："+testHasCss($("#top1"),"big"));
consolelog("是否存在color属性："+testHasCss($("#top1"),"color"));
consolelog("是否存在display属性："+testHasCss($("#top1"),"display"));
consolelog("是否存在gogo属性："+testHasCss($("#top1"),"gogo"));
});
var testHasCss = function(obj,cssStr){
if((obj)css(cssStr) === undefined){
return false;
}else{
return true;
}
}
结果如下
以上就是关于jQuery点击改变Class 修改css 样式全部的内容，包括:jQuery点击改变Class 修改css 样式、jquery如何改变css背景图、jquery 获取css3动画animation的值，改变animation的值问题等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）