0

他のいくつかの div を持つコンテナー div があります。

<div class='container'>
 <div>one</div>
 <div>two</div>
 <div>three</div>
 <div>four</div>
</div>

次のように、コンテナ div 内のすべての div を ps に変更したいと思います。

 <div class='container'>
 <p>one</p>
 <p>two</p>
 <p>three</p>
 <p>four</p>
</div>

jqueryでこれを達成するにはどうすればよいですか? 前もって感謝します。

編集: 明確さの欠如をお詫びします。正確には、複数の div コンテナーがあり、それぞれに他の div が含まれています。既に提供されている回答は、div コンテナーに含まれる div のみを変更するとは思いませんが、すべての div を変更します。

<!--block one-->
 <div class='container'>
 <div>one</div>
 <div>two</div>
 <div>three</div>
 <div>four</div>
</div>

 <!--block two-->
  <div class='container'>
 <div>one</div>
 <div>two</div>
 <div>three</div>
 <div>four</div>
</div>

  <!--block three-->
  <div class='container'>
 <div>one</div>
 <div>two</div>
 <div>three</div>
 <div>four</div>
</div>

等々。私が必要としているのは、div クラス コンテナー内の div のみが p に変更されることです。

  <div class='container'>
   <p>one</p>
   <p>two</p>
   <p>three</p>
   <p>four</p>
  </div>


 <div class='container'>
   <p>one</p>
   <p>two</p>
   <p>three</p>
   <p>four</p>
  </div>

それを行うための小さなプラグインがあります:

  (function($) {
   $.fn.changeElementType = function(newType) {
    var attrs = {};

    $.each(this[0].attributes, function(idx, attr) {
        attrs[attr.nodeName] = attr.nodeValue;
    });

    this.replaceWith(function() {
        return $(\"<\" + newType + \"/>\", attrs).append($(this).contents());
     });
     }
     })(jQuery);

使用する:

$(\"div\").changeElementType(\"p\");

しかし、それを行うと、すべての div が ps に変更されませんか? クラスコンテナのdiv内のdivのみを対象とするように変更するにはどうすればよいですか? ありがとうございました。

4

4 に答える 4

4

tagName を実際に変更することはできませんが、既存の div を p に置き換えることはできます。

$('.container').children('div').each(function(e, el) {
    $(el).replaceWith( $('<p />', {text: $(this).text()}) );
});

フィドル

于 2013-02-23T19:41:43.627 に答える
4 
$(function() {
    $('.container > div').each(function() {
        $(this).contents().wrapAll("<p>").parent().unwrap();
    });
});
于 2013-02-23T19:42:14.493 に答える
3

Control Fを押して検索ツールを開き、検索と置換をクリック<div>して、検索で「<p>」、置換で「」と入力してから、必要なものを調べて置換を押すと、簡単に実行できます。エラーなし:)

于 2013-02-23T19:43:12.430 に答える
1

これを試して

$(".container").children("div").replaceWith(function(){

   return $("<p />").append($(this).contents());

});
于 2013-02-23T19:46:15.450 に答える