したがって、「既存の」動作が関連付けられている要素があります。そのため、(いくつかの新しい要件で必要とされるように) 移動するだけで、既存の動作が維持される = 良いことがわかりました。しかし、問題は、要素を移動するときに「新しいスタイル」を与える必要があることです。
だから、私はこのようなものを持っている場合:
<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など...
legacyElementがexistingStructureの下にあるときにスタイルを失い、「newStructure」などに移動したときに新しいスタイルを取得できる、より優れた/より簡単で堅牢な方法はありますか? その要素「legacyElement」は前後にpingを実行します..そのため、各親divの下にスタイルを配置する必要があります。
そのため、ページでアクションが発生すると、元に戻します。
jQuery('#existingStructure').append('#legacyElement');
簡潔でない場合は、お知らせください。
既存のスタイルは外部 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
}