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

Question

有没有办法从 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 值选择器？

Answer 1

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

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

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

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

然后，您可以按索引访问此数组，以获取 Calibri：

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

并获得无衬线字体：

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

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

Answer 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>

');