使用jQuery获取多个CSS属性

我知道你可以像这样设置多个css属性：

$('#element').css({property: value, property: value}); 

但是如何使用CSS获取多个属性？ 有什么解决方案吗？

Answer 1

您可以创建自己的jQuery函数来执行此操作：

 //create a jQuery function named `cssGet` $.fn.cssGet = function (propertyArray) { //create an output variable and limit this function to finding info for only the first element passed into the function var output = {}, self = this.eq(0); //iterate through the properties passed into the function and add them to the output variable for (var i = 0, len = propertyArray.length; i < len; i++) { output[propertyArray[i]] = this.css(propertyArray[i]); } return output; }; 

这是一个演示： http ： //jsfiddle.net/6qfQx/1/ （检查你的控制台日志以查看输出）

此函数需要传入一个包含要查找的CSS属性的数组。 用法如下：

 var elementProperties = $('#my-element').cssGet(['color', 'paddingTop', 'paddingLeft']); console.log(elementProperties.color);//this will output the `color` CSS property for the selected element 

Answer 2

最简单的方法？ 删除jQuery。

 var e = document.getElementById('element'); var css = e.currentStyle || getComputedStyle(e); // now access things like css.color, css.backgroundImage, etc. 

Answer 3

jquery的css方法（从1.9开始）说你可以传递一个属性字符串数组，它将返回一个带键/值对的对象。

例如：

 $( elem ).css([ 'property1', 'property2', 'property3' ]); 

http://api.jquery.com/css/