HTMLタグを削除しますが、innerHtmlは保持します

簡単なフォーマットを取り除く必要のある簡単なHTMLがあります。

A nice house was found in <b>Toronto</b>.

太字を削除する必要がありますが、文はそのままにしておきます。

これはjQueryでどのように可能ですか？

$('b').contents().unwrap();

これは、すべて選択し<b>、その後、要素を使用して.contents()のテキストコンテンツをターゲットに<b>、そして.unwrap()その親削除する<b>要素を。

最高のパフォーマンスを得るには、常にネイティブにしてください。

var b = document.getElementsByTagName('b');

while(b.length) {
    var parent = b[ 0 ].parentNode;
    while( b[ 0 ].firstChild ) {
        parent.insertBefore(  b[ 0 ].firstChild, b[ 0 ] );
    }
     parent.removeChild( b[ 0 ] );
}

これは、ここで提供されているどのjQueryソリューションよりもはるかに高速です。

次の.replaceWith()ようにを使用することもできます。

$("b").replaceWith(function() { return $(this).contents(); });

または、それが単なる文字列であることがわかっている場合：

$("b").replaceWith(function() { return this.innerHTML; });

上記のいずれの方法ものコストよりもはるかに高速であるため、多くの要素をアンラップする場合、これは大きな違いを生む可能性があります.unwrap()。

内部のHTML要素を削除してテキストのみを返す最も簡単な方法は、 JQuery .text（）関数です。

例：

var text = $('<p>A nice house was found in <b>Toronto</b></p>');

alert( text.html() );
//Outputs A nice house was found in <b>Toronto</b>

alert( text.text() );
////Outputs A nice house was found in Toronto

jsFiddleデモ

これはどう？

$("b").insertAdjacentHTML("afterend",$("b").innerHTML);
$("b").parentNode.removeChild($("b"));

1行目はbタグのHTMLコンテンツをタグの直後の場所にコピーしb、2行目はタグを削除しますbはDOMからタグを、コピーされたコンテンツのみを残します。

私は通常これを関数にラップして使いやすくしています：

function removeElementTags(element) {
   element.insertAdjacentHTML("afterend",element.innerHTML);
   element.parentNode.removeChild(element);
}

すべてのコードは実際には純粋なJavascriptであり、使用されている唯一のJQueryは、ターゲットにする要素を選択するものです（ b最初の例のタグ）です。関数は単なるJS：Dです。

また見てください：

• https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentHTML

// For MSIE:
el.removeNode(false);

// Old js, w/o loops, using DocumentFragment:
function replaceWithContents (el) {
  if (el.parentElement) {
    if (el.childNodes.length) {
      var range = document.createRange();
      range.selectNodeContents(el);
      el.parentNode.replaceChild(range.extractContents(), el);
    } else {
      el.parentNode.removeChild(el);
    }
  }
}

// Modern es:
const replaceWithContents = (el) => {
  el.replaceWith(...el.childNodes);
};

// or just:
el.replaceWith(...el.childNodes);

// Today (2018) destructuring assignment works a little slower
// Modern es, using DocumentFragment.
// It may be faster than using ...rest
const replaceWithContents = (el) => {
  if (el.parentElement) {
    if (el.childNodes.length) {
      const range = document.createRange();
      range.selectNodeContents(el);
      el.replaceWith(range.extractContents());
    } else {
      el.remove();
    }
  }
};

別のネイティブソリューション（コーヒー）：

el = document.getElementsByTagName 'b'

docFrag = document.createDocumentFragment()
docFrag.appendChild el.firstChild while el.childNodes.length

el.parentNode.replaceChild docFrag, el

user113716のソリューションよりも高速かどうかはわかりませんが、一部のユーザーにとっては理解しやすいかもしれません。

最も簡単な答えは心を吹き飛ばすことです：

outerHTMLはInternet Explorer 4までサポートされています！

ここでは、jQueryがなくてもjavascriptでそれを行うことです

function unwrap(selector) {
    var nodelist = document.querySelectorAll(selector);
    Array.prototype.forEach.call(nodelist, function(item,i){
        item.outerHTML = item.innerHTML; // or item.innerText if you want to remove all inner html tags 
    })
}

unwrap('b')

これは古いIEを含むすべての主要なブラウザで動作するはずです。最近のブラウザでは、ノードリストでforEachを呼び出すこともできます。

function unwrap(selector) {
    document.querySelectorAll('b').forEach( (item,i) => {
        item.outerHTML = item.innerText;
    } )
}