Question

所以，我有一个元素，它附加了一些“预先存在的”行为。因此，我发现只需移动它（根据一些新要求的要求）保留现有行为=好。但问题是，当我移动元素时，我需要给它“新风格”。

所以，如果我有这样的事情：

<div id="existingStructure">
    <div id="legacyElement"></div>
</div>

现在，它已经存在预先存在的样式。我可以重新安排这些风格等等。但我无法改变它们。样式附加到“id”而不是类定义。我相信如果需要，我可以改变它。

现在，当某些事情发生在“新div”时，我需要移动“legacyElement”。我只是

jQuery('#newStructure').append('#legacyElement');

<div id="newStructure">
    <div id="legacyElement"></div>
</div>

不幸的是，我在newStructure上的样式似乎没有应用于* legacyElement“动态移动到这里。

我在考虑将所有样式移动到类而不是与id相关联，当我移动它时...我只是jQuery（）。addClass / jQuery（）。removeClass等...

是否有一种更好/更容易更强大的方式，当它位于 existingStructure 下时，我可以让 legacyElement 松散其样式，然后在移动到“em”时获取新样式新结构“等......反之亦然。那个元素“legacyElement”会来回ping ..所以，我需要它在每个父div下面都有样式。

所以当一个动作发生在页面上时，我会将其移回：

jQuery('#existingStructure').append('#legacyElement');

如果我不够简洁，请告诉我。

EXISTING样式位于外部CSS文件中，就像这样..

#existingStructure {
   // bunch of css
 }

#existingStructure .item1 input[type="text"] {
   // bunch of css
}

 #legacyElement{
   // bunch of css
  }

并且新样式排序相同，但可能会应用“其他样式”。

#newStructure {
   // bunch of css
 }

#newStructure .item1 input[type="text"] {
   // bunch of css
}

Answer 1

你当然可以通过父母来定位你的div风格：

#existingStructure #legacyElement {some styles}
#newStructure #legacyElement {some other styles}

为了进一步解释，这种安排应该产生更大的特异性，覆盖简单应用于#existingStructure或#legacyElement的样式。我希望没有人做过任何愚蠢的事情，就像使用它们一样重要。

Answer 2

简短回答：应该。

这是我在jsFiddle中快速制作的一个例子：http://jsfiddle.net/CCm4J/1/

那么为什么不是你的呢？很可能你有嵌入的css规则，只有在existingStructure id / class中才适用？没有看到更多你的CSS我不知道我能得到多少具体。我只是验证您的css规则是否允许在existingStructure之外应用（即使existingStructure也可能有其父级的规则！）

将元素移动到新div中 - 不会采用其新的css属性

2 个答案: