Jquery如何使用堆叠值选项（例如font-family）从css属性中获取特定的css值答案

【问题标题】：Jquery how to get specific css values from css properties with stacked value options such as font-familyJquery如何使用堆叠值选项（例如font-family）从css属性中获取特定的css值
【发布时间】：2012-12-09 23:23:05
【问题描述】：

有没有办法从 Jquery 中的 css 属性值堆栈中获取第一个或任何其他特定值项？

body {
    font-family: Calibri, Arial, Helvetica, sans-serif;
    font-size: 8px;
}

var firstFontOption = $('body').css('font-family') //How can I store only "Calibri" referencing the above?

var secondFontOption = $('body').css('font-family') //How can I store only "Arial" referencing the above?

我只有$('body').css('font-family') 显示所有值“Calibri、Arial、Helvetica、sans-serif”。 Jquery 是否有第一个、第二个或其他 css 值选择器？

【问题讨论】：

标签： jquery css properties fonts selector

【解决方案1】：

你可以做的是像这样分割字符串：

 $('body').css('font-family').split(",");

这应该给你一个字符串数组：

 ["Calibri", "Arial", "Helvetica", "sans-serif"]

然后你可以通过索引访问这个数组来获取 Calibri：

 $('body').css('font-family').split(",")[0];

并获得无衬线：

 $('body').css('font-family').split(",")[3];

我不知道是否有更清洁的方法，但这会起作用

【讨论】：

您可能还想$.trim() 每个结果以消除多余的空格。

【解决方案2】：

要获取特定属性，您可以简单地指向该 div/HTML 标记并获取内联 css 属性。像这样：

$('body').css('font-size');

alert($('.text').css('color'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<div class="text" style="color:red">
  Alpha To Delta
</div>

');

【讨论】：