0

したがって、「既存の」動作が関連付けられている要素があります。そのため、(いくつかの新しい要件で必要とされるように) 移動するだけで、既存の動作が維持される = 良いことがわかりました。しかし、問題は、要素を移動するときに「新しいスタイル」を与える必要があることです。

だから、私はこのようなものを持っている場合:

<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
}
4

2 に答える 2

2

親によって div スタイルを確実にターゲットにすることができます。

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

さらに説明すると、この配置により、#existingStructure または #legacyElement のいずれかに単純に適用されるスタイルをオーバーライドして、より具体的な結果が得られるはずです。!important を使用するような愚かなことを誰もしていないことを願っています。

于 2013-02-18T21:21:26.013 に答える
1

短い答え: そうあるべきです。

jsFiddle で簡単に作成した例を次に示します: http://jsfiddle.net/CCm4J/1/

では、なぜあなたのものではないのですか?existingStructureおそらく、id/classにある場合にのみ適用される css ルールが埋め込まれている可能性がありますか? あなたのcssをもっと見ないと、どれだけ具体的にできるかわかりません。あなたのCSSルールが外部で適用できることを確認するだけですexistingStructure(そして、その親にもexistingStructureルールがあるかもしれません!)

于 2013-02-18T21:28:11.427 に答える