JQuery：要素のコンテンツでアニメーションを実行する

Question

divには、いくつかのパディング、ボーダー、スタイルが適用されています。 div内には私は平易な文章しかありません。このような何か：通常

<div id=test style="border: 2px solid black; background-color: blue;"> 
    The text I would like to animate 
</div> 

内容をアニメーション化するためには、私はこのようなものだろう：

$('#test > *').hide(1000);

をしかし、どうやら> *は唯一の子要素、および例えばない非要素（テキストを選択し、 ）

だから私の現在の仕事は、周りにある：

<div id=test style="border: 2px solid black; background-color: blue;"> 
    <span>The text I would like to animate</span> 
</div> 

spanを作成する必要はありません。

Answer 1

[OK]を、動的にspanタグでコンテンツをラップんすべて現実にいる間、それはにspanタグを配置する必要がなくなります

$('#test').wrapInner('<span></span>').contents().hide(1000); 

...私はこれで別の刺しを取るだろうと思ってあなたのマークアップ。私はあなたの目標を達成すると信じています

Answer 2

使用.contents（）

$('#test').contents().hide(1000); 

EDIT：

親div要素の "中身" がテキストノードではなく、DOMノード（であるため、このソリューションが動作しない理由は、スパン、div、pなど）。したがって、cssプロパティ "display"と、.hide（）および.show（）関数が動作するその他のDOM関連プロパティはありません。

私がコメントで指摘したように、テキストコンテンツを操作する必要性にかかわらず、インラインDOMエレメントにテキストコンテンツをラップするのは一般的には良い考えです。