jQuery: 在克隆的元素上使用 .css 以获得特定的 css 属性？

Question

我正在尝试获取当前应用于克隆元素的字体大小，但是当我使用 jQuery .css 函数时，它没有检索到任何内容。

是否无法使用 jQuery 中的“.css”函数从克隆的元素中检索特定的 css 属性？

以下无效：

var clonedElement = jQuery('.element').clone();
clonedElement.attr("style", "");
var defaultFontSizeValue = clonedElement.css('font-size');
console.log(defaultFontSizeValue);

编辑 1 不幸的是，原件具有内联样式，不允许我为通过 class 应用的元素获取覆盖的字体大小属性。这就是为什么我试图通过删除克隆中的内联样式来检索原始值的原因。

Answer 1

您的问题是克隆的元素对于您的 dom 而言不是 "attached"，因此该元素没有样式定义（基于非内联的 css） .

你可以做的是将克隆的元素附加到 body（如果需要，在设置 display: hidden 之后），然后检查字体大小：

$(function() {
  console.log($('.c1').css('fontSize'));
  c1 = $('.c1').clone();
  console.log(c1.css('fontSize'));
  
  c1.css('display', 'none');
  $('body').append(c1)
  console.log(c1.css('fontSize'));
});

.c1 {
  font-size: 12px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="c1">asd</div>

jQuery: 在克隆的元素上使用 .css 以获得特定的 css 属性？

jQuery: using .css on a cloned element to obtain a specific css property?

javascript

css

jquery

clone