0

私はjqueryを学習しようとしているので、(今のところ)段落だけを残して、ページ上のほとんどのものを非表示にするスクリプトを作成しようとしています。

(function() {
  var all = $("*");
  all.hide();

  var paragraphs = $("p");
  paragraphs.show();
 })();

それは私が今持っているコードですが、それは機能しません。すべてを非表示にしますが、その後の段落は表示されません。私は何が間違っているのですか?

4

7 に答える 7

3

開始するための1つの解決策は次のとおりです。

$("body :not(p)").hide();

次のように読みます:要素内<body>で、ではないすべての要素を検索します。 <p>

マークアップは非常に単純で、ネストされた要素は最小限に抑えられていると思います。

<html>
<head></head>
<body>
    <h1>Heading</h1>
    <p>Paragraph 1</p>
    <div>Text block</div>
    <p>Paragraph 2</p>
</body>
</html>

それ以外の場合は、他の回答(およびコメント)に記載されているように、<p>要素に非<p>親が含まれているかどうかを検討する必要があります。このような場合、ネストされた段落は表示されないままになる可能性があります。

于 2012-10-19T19:38:36.617 に答える
2

隠された親の子を表示することはできません。あなたがやろうとしていることはうまくいきません。タグの祖先<p>がすべ​​て表示されていることを確認する必要が<body>あり<html>ます。

回避策として、すべての<p>タグを親から切り離し、ボディ内に残っているすべてのものを非表示に<p>して、ボディに直接再アタッチすることができます。元の状態に戻す限り、この時点であなたのdomは不可逆的に壊れます。

var paragraphs = $('p').detach();

$('body *').hide();

$('body').append(paragraphs);

これの実用化は考えられません。おそらく、自分がやろうとしていることを再考し、新しい知識に対応するためにマークアップを変更する必要があります。

于 2012-10-19T19:39:33.963 に答える
1

すべてを非表示にすると、および<p>を含む各のすべての親要素も非表示になります。要素を表示する場合は、それらが表示されていることを確認する必要があります。<html><body><p>

代わりに、段落とその親を表示します。

$('*').hide();
$('p').parents().andSelf().show();

または、段落を含まない要素のみを非表示にします。

$(':not(:has(p), p)').hide();
于 2012-10-19T19:38:55.130 に答える
1
$('body :not(p)').hide();
$('body p').appendTo('body');

段落以外のすべてを非表示にしてから、段落を移動して体の直接の子にします。

「appendTo」やその他のメソッドは実際には要素のクローンを作成するのではなく、DOMにすでに存在する場合は要素を移動するだけであることに注意してください。

于 2012-10-19T19:40:20.980 に答える
0

段落が表示されていても、bodyそれを囲むものは非表示になっています。したがって、段落を表示しても表示されません。本体である親も非表示になっているためです。

于 2012-10-19T19:38:52.893 に答える
0

私の推測では、*ワイルドカードにはが含まれて<body>います。試す:

$("body *").hide();
$("p").show().parents().show();

コメントでMarcBが指摘しているように、あなたも.show()すべての<p>親に必要です(これが何をするのか.parents().show()

于 2012-10-19T19:39:11.073 に答える
0

親が非表示になっている場合、Pは表示されません。

(function() {
  var all = $("body *").not("p");
  all.hide();
 })();

すべてのpを表示したいが他の人を非表示にしたい場合は、次のようにすべてのpを本文に追加できます。

(function() {
  var all = $("body *").not("p");
  all.hide();
   $("p").appendTo('body');
 })();
于 2012-10-19T19:40:09.177 に答える