jquery获取css
jQuery 获取 CSS 属性的方法
使用 jQuery 可以轻松获取元素的 CSS 属性值。以下是几种常用的方法：
使用 .css() 方法
通过 .css() 方法可以获取指定元素的 CSS 属性值。该方法接受一个属性名作为参数，返回该属性的计算值。
var color = $('#element').css('color');
console.log(color); // 输出元素的计算颜色值（如 'rgb(255, 0, 0)'）获取多个 CSS 属性 如果需要获取多个 CSS 属性，可以传入一个属性名数组。
var styles = $('#element').css(['color', 'font-size', 'background']);
console.log(styles); // 输出包含多个属性值的对象获取计算样式
jQuery 的 .css() 方法返回的是计算后的样式值，而不是内联或样式表中定义的值。例如，即使元素通过类名设置样式，也能正确获取。
var margin = $('.box').css('margin-top');
console.log(margin); // 输出计算后的 margin-top 值（如 '10px'）注意事项
- 获取的属性值是字符串形式，包含单位（如
px、em等）。 - 对于复合属性（如
margin、padding），需指定具体方向（如margin-top）。 - 某些属性（如
background）可能返回浏览器特定的值，建议使用具体属性（如background-color）。
示例代码
以下是一个完整的示例，展示如何获取并打印元素的 CSS 属性值：
$(document).ready(function() {
var element = $('#target');
var width = element.css('width');
var height = element.css('height');
var backgroundColor = element.css('background-color');
console.log('Width: ' + width);
console.log('Height: ' + height);
console.log('Background Color: ' + backgroundColor);
});其他相关方法
.width() 和 .height()
如果需要获取元素的宽度或高度，可以直接使用 .width() 和 .height() 方法，返回的是数值（无单位）。
var elementWidth = $('#element').width();
var elementHeight = $('#element').height();.innerWidth() 和 .innerHeight()
获取元素的内部宽度和高度（包括 padding，不包括 border）。
var innerWidth = $('#element').innerWidth();
var innerHeight = $('#element').innerHeight();.outerWidth() 和 .outerHeight()
获取元素的外部宽度和高度（包括 padding 和 border）。
var outerWidth = $('#element').outerWidth();
var outerHeight = $('#element').outerHeight();通过以上方法，可以灵活地获取元素的 CSS 属性和尺寸信息。
