Question

我有一个名为<span>的{{1}}，它有一些来自内联+ CSS文件的样式。

我还有一个名为spn1的{{1}}。

如何将<span>的完整样式复制到spn2？

我希望spn1看起来像spn2一样（风格）。

Answer 1

试试这个：

$("#spn2").attr("style", $("#spn1").attr("style"))
    .addClass($("#spn1").attr("class"));

Answer 2

看一下这个帖子： https://stackoverflow.com/a/6416527/541827
我们的想法是将所有样式的属性从一个项目复制到另一个项目

或者只使用jquery.copycss.js插件，答案基于。
用法：

$('#some-element').copyCSS('#another-element');  // copy all styles
$('#some-element').copyCSS('#another-element', ['top', 'left']);  // copy just top and left
$('#some-element').copyCSS('#another-element', null, ['top', 'left']);  // copy everything except top and left

Answer 3

jQuery没有任何直接的工具来执行此操作。您将不得不使用普通的旧JavaScript来查找跨浏览器的方式来将一个元素的计算样式复制到另一个元素。 This answer有一个潜在解决方案的实现。

Answer 4

<强>更新

检查这个小提琴：http://jsfiddle.net/9BJ5y/

更好的想法是克隆spn1并用它替换spn2。

即。类似的东西：

var x = $('#spn2').html();
$('#spn2').replaceWith($('#spn1').clone().html(x).attr('id', 'spn2'));

Answer 5

<div style='background-color:red; display:hidden' id='template'>
    <span>Something</span>
</div>

var replica=$('#template').clone();
replica
.removeAttr('id')
.css('display', 'block')
.find('span').text('Whatever');
replica.appendTo('#container');

Answer 6

有没有理由你不是简单地做.clone（true）？

http://jsfiddle.net/johncmolyneux/6Fz84/

此示例复制内联和类样式，但不复制id样式（这可能非常有用）。

Answer 7

尝试使用此：

document.getElementById("spn2").style = document.getElementById("spn1").style;

Answer 8

如果只需要CSS，则可以执行以下操作：

let cssText = document.defaultView.getComputedStyle( $("#elementID"), "").cssText;

然后您可以将其应用于任何新元素。

Answer 9

为什么不在当时对这两个元素应用任何规则？

类似的东西：

$('spn1','spn2').css({color: 'red'});

您可以使用多个选择器http://api.jquery.com/multiple-selector/

在jQuery中克隆风格？

9 个答案: