☰

jQuery、要素全体のHTMLを取得する [重複] 質問する

tag-icon • tag-icon jquery html
jQuery、要素全体のHTMLを取得する [重複] 質問する

選択した要素の内容だけでなく、その HTML 全体を取得したいと考えています。 .html() は、ドキュメントに従って JavaScript の innerHTML() メソッドを使用します。 HTML:

<div id="divs">
  <div id="div1">
    <p>Some Content</p>
  </div>
  <div id="div2">
    <p>Some Content</p>
  </div>
</div>

を使用すると$('#divs:first').html();、段落要素のみが返されます。次のように、要素全体の HTML を取得したいとします。

  <div id="div1">
    <p>Some Content</p>
  </div>

両方の子 div の HTML を返すため、.parent は使用できません。

ベストアンサー1

次のようにクローンして、コンテンツ全体を取得できます。

var html = $("<div />").append($("#div1").clone()).html();

または、これをプラグインにします。ほとんどの場合、次のようにこれを「outerHTML」と呼びます。

jQuery.fn.outerHTML = function() {
  return jQuery('<div />').append(this.eq(0).clone()).html();
};

次に、次のように呼び出すだけです:

var html = $("#div1").outerHTML();

おすすめ記事