違いはありますか
jQuery('#id').show() and jQuery('#id').css("display","block")
そして
jQuery('#id').hide() and jQuery('#id').css("display","none")
回答:
jQuery( '#id')。css( "display"、 "block")
display
プロパティがあり、その中の多くの可能な値を持つことができblock
、inline
、inline-block
、そしてより多くの。
この.show()
メソッドはblock
、必ずしもに設定する必要はありませんが、定義したものにリセットします(ある場合)。
jQueryのソースコードでは、あなたは彼らが設定しているかを確認することができますdisplay
:それはすべてのjQueryの操作の前だったかどうか確認するために「」(空文字列)にプロパティを少しリンク。
一方、非表示はを介して行われるdisplay: none;
ため、ある点を考慮.hide()
して.css("display", "none")
同等にすることができます。
とにかく.show()
、.hide()
落とし穴を避けるために使用することをお勧めします(さらに、それらはより短いです)。
show()とcss({'display': 'block'})の違い
あなたが最初にこれを持っていると仮定して:
<span id="thisElement" style="display: none;">Foo</span>
あなたが電話するとき:
$('#thisElement').show();
あなたが得るでしょう:
<span id="thisElement" style="">Foo</span>
一方:
$('#thisElement').css({'display':'block'});
します:
<span id="thisElement" style="display: block;">Foo</span>
ですから、違いがあります。
hide()とcss({'display': 'none'})の違い
上記と同じですが、これらをhide()に変更し、 ':' none '.....を表示します。
もう一つの違いは、
とき.hide()
ときに、jQueryのデータ・キャッシュに保存された表示プロパティの値と呼ばれる.show()
と呼ばれ、初期表示値が復元されます!
A:はい、両方の性能に差がある
jQuery('#id').show()
よりも遅いjQuery('#id').css("display","block")
ディスプレイとしてjqueryのキャッシュから初期状態を取得するために行う必要があり、前者の場合余分な作業のようにはそれができるバイナリ属性ではありませんinline
、block
、none
、table
、などと類似のhide()
メソッドの場合です。
パラメータがない場合、.hide()メソッドは要素を非表示にする最も簡単な方法です。
$( '。target')。hide(); 一致した要素は、アニメーションなしですぐに非表示になります。これは、.css( 'display'、 'none')を呼び出すのとほぼ同じですが、displayプロパティの値がjQueryのデータキャッシュに保存され、後でdisplayを初期値に復元できるようになります。要素の表示値がインラインの場合、非表示にして表示すると、再びインラインで表示されます。
ショーについても同じ
.show()
が適切なdisplay
プロパティを設定することを除いて、適切なプロパティを手動で選択する必要がありますが、.css()
はい、違いがあります。
jQuery('#id').css("display","block")
常にブロックとして表示したい要素を設定します。
jQuery('#id').show()
will etは、最初はどのディスプレイタイプであったか、たとえば、ディスプレイ:インラインです。
JqueryDocを参照してください
ソースコード(ここではv1.7.2)を見ることができます。
我々が設定することができ、アニメーションを除いて、これはまた、メモリ内の古い表示スタイルキープ(すべてのケースではないがblock
、それはまたすることができinline
、table-cell
...)。
http://api.jquery.com/show/を参照してください
パラメータがない場合、.show()メソッドは要素を表示する最も簡単な方法です。
$( '。target')。show();
一致した要素は、アニメーションなしですぐに表示されます。これは、displayプロパティが最初の状態に復元されることを除いて、.css( 'display'、 'block')を呼び出すのとほぼ同じです。要素の表示値がインラインの場合、非表示にして表示すると、再びインラインで表示されます。