gpt4 book ai didi

jquery - 如何使用 JavaScript 将所有计算的 CSS 样式从一个元素移动到另一个元素?

转载 作者:行者123 更新时间:2023-12-03 22:21:26 26 4
gpt4 key购买 nike

我有一个外部样式表,它将某些样式应用于给定元素。我希望能够将这些样式(使用 JavaScript)完全移动到不同的元素,而无需事先了解正在应用的样式。

CSS:

td { padding: 5px }
div { }

HTML:

<td>
<div>
Apply the TD styles to this DIV (instead of the TD).
</div>
</td>

JavaScript:

$(document).ready(function(){
$('tr').children('td').each(function(){
//move the td styles to div
});
});

我怎样才能实现这个目标?

更新:需要明确的是,我无法控制 CSS。我无法知道可以应用什么样式。我试图解决的问题是能够获取一个元素并复制其样式(可能未知)并将它们应用到不同的元素。

最佳答案

这是我想出的一个解决方案,它混合了 document.defaultView.getCompulatedStyle 和 jQuery 的 .css():

<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" > </script>
<link href="style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div id="test" style="background-color: #FF7300">
<p>Hi</p>
</div>
<a href="#" id="button">Apply styles</a>
<script>
$("#button").click(function() {
var element = document.getElementById("test");
$("#victim").css(document.defaultView.getComputedStyle(element, null));
});
</script>
<div id="victim">
<p>Hi again</p>
</div>
</body>

//style.css 
#test {
border: 3px solid #000000;
}

它的作用是复制计算的样式对象,包括 style.css 和内联样式,并使用 jQuery 的 .css() 将其设置到另一个 div

我希望我没有误解这个问题,这就是您所需要的。

编辑:我忘记的是您要求“移动”样式而不是复制它。使用 jQuery 的 .removeClass() 和使用 .attr() 删除 style 属性从前一个 div 中删除样式非常简单,但您必须记住,如果有任何样式规则应用于元素的 ID,则有没有办法阻止它们被应用。

关于jquery - 如何使用 JavaScript 将所有计算的 CSS 样式从一个元素移动到另一个元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3808400/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com