Question

我有这个代码可以复制一个元素的内容并将其放在另一个元素上。但我实际上想复制内联样式，尤其是定位。有没有办法只复制位置样式，以便信息窗口显示在我悬停时a.star的确切位置？

$(document).ready(function(){
  $('a.star').hover(function(){
    var instrument = '.instrument_info#' + $(this).attr('instrument');
    var htmlCode = $(instrument).html();
    $('.instrument_output .instrument_detail').html(htmlCode);
    $('.instrument_output').slideToggle();
  })
});

我希望得到这个的内联定位：<div class="instrument_info" id="drums" style="top:95px; left:294px">并将其放在另一个div中。如何在我的jQuery代码中插入它？

Answer 1

.html()根本不包含内联样式。您需要使用jQuery .css()函数;

$(".target_elements").css({top: $("someElement").offset().top, left: $("someElement").offset().left});

由于.offset()会返回{top: ..., left: ...}个对象，因此您可以将上述内容更紧凑地写为：

$(".target_elements").css($("someElement").offset());

Answer 2

您必须从一个DOM元素中读取这些属性并将它们分配给另一个。

 var foo_offset = $('#foo').offset() # returns {left: 100, top: 100}
 $('#bar').offset(foo_offset)        # #bar's offset set to #foo's

查看CSS documentation。所有方法都设计有一个签名，在调用时为您提供属性的实际值，并在使用其他参数调用时将对象分配给这些属性。

将特定样式从一个元素复制到另一个元素

2 个答案: