1

get_template_part(); を介して wordpress ループで追加されたいくつかの div 要素を削除したいと考えています。

構造は次のようなものです。

<div id="level1" class="col-0-1 noPad">
    get_template_part('new-story');   
</div>

読みやすくするために、ほとんどのループを切り取っています。

テンプレート部分は次のように構成されています。

<div class="col-OuterContainer noPad">
  stuff
</div>

したがって、実際には次のようになります。

 <div id="level1" class="col-0-1 noPad">
    <div class="col-OuterContainer noPad">
      stuff
    </div>  
</div>

「col-OuterContainer」という名前の divz が 2 つ以上あるかどうかを検出し、その後 divz を削除します。私はそれがかなり簡単だと思って、これを試しました： 

var num = $('.col-OuterContainer').length;
if (num > 2) {
   $('#level1>div:gt(1)').remove();
}

現時点で 3 つの投稿があるため、3 つ目は削除する必要がありましたが、削除されていません。3 の console.log を取得しているので、そこに 3 つの要素があることは明らかなので、3 番目の要素を削除しないのはなぜですか?

更新：コードをもう少しいじってみました。

wp ループは同じです。

 <div id="level1" class="col-0-1 noPad">
        get_template_part('new-story');   
    </div>

get_template_part 内のコードは次のとおりです。

<div class="col-OuterContainer noPad"><div>stuff 1</div></div>

JSはこれです：

jQuery(document).ready(function($){ 
console.log( $('.col-OuterContainer').length );
$('#level1 .noPad:gt(1)').remove();     
});

私はこの出力を得ています：

<div id="level1" class="col-0-1 noPad">
<div class="col-OuterContainer noPad"><div>stuff 1</div></div>
<div class="col-OuterContainer noPad"><div>stuff 1</div></div>
<div class="col-OuterContainer noPad"><div>stuff 1</div></div>
</div>

コンソールには 3 つの要素が表示されますが、noPad または .col-OuterContainer をターゲットにしても 3 番目の要素は削除されません。

4

2 に答える 2

0 
var num = $('.col-OuterContainer').length;

これにより、ドキュメント全体divで class を持つの数が得られます。col-OuterContainer

$('#level1>div:gt(1)') { ...

divこのセレクターは、ノードの直接の子であるのみをカウントし#level1ます。

ページの他の場所にありますか、それともnode.col-OuterContainerの奥深くにネストされていますか?#level1

于 2013-10-17T12:06:11.810 に答える