如何从字符串中除去特殊类之外的所有HTML元素？

Question

我有问题。我目前正在寻找一种从字符串中删除所有HTML元素的方法。但是有两个条件：

1. 应保留元素的内容
2. 不应该删除具有已定义类的特殊元素

我已经尝试了很多事情，并查看了很多有关SO的问题/答案，但是很遗憾，我无法真正找出任何答案。不幸的是，这远远超出了我的能力。但是我想知道类似的东西如何工作。

我尝试过的问题/答案：How to strip HTML tags from string in JavaScript?，Strip HTML from Text JavaScript

所以当我有例如这样的字符串时：

You have to pay <div class="keep-this">$200</div> per <span class="date">month</span> for your <span class="vehicle">car</span>

剥离后应该看起来像这样：

You have to pay <div class="keep-this">$200</div> per month for your car

我实际上已经尝试了以下操作：

jQuery(document).ready(function ($) {
	let string = 'You have to pay <div class="keep-this">$200</div> per <span class="date">month</span> for your <span class="vehicle">car</span>';

	console.log(string);

	function removeHTMLfromString(string) {
		let tmp = document.createElement("DIV");

		tmp.innerHTML = string;
		return tmp.textContent || tmp.innerText || "";
	}

	console.log(removeHTMLfromString(string));

	console.log(string.replace(/<[^>]*>?/gm, ''));
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

而且我还尝试了一个正则表达式工具来查看删除的内容，但不幸的是，我在这里也没有太多进展：

https://www.regexr.com/50qar

[如果有人可以帮助我完成这项任务，我会很乐意。非常感谢！

Answer 1

可能是一些大代码。但我认为这可能会对您有所帮助。

let str = 'You have to pay <div class="keep-this">$200</div> per <span class="date">month</span> for your <span class="vehicle">car</span> <div class="keep-this">$500</div> also';

const el = document.createElement("div");
el.innerHTML = str;

// Get all the elements to keep
const keep = el.querySelectorAll(".keep-this");

// Replace the keeping element from the original string
// With special pattern and index so that we can replace
// the pattern with original keeping element
keep.forEach((v, i) => {
  const keepStr = v.outerHTML;
  str = str.replace(keepStr, `_k${i}_`);
});

// Replace created element's innerHTML by patternised string.
el.innerHTML = str;

// Get the text only
let stringify = el.innerText;

// Replace patterns from the text string by keeping element
keep.forEach((v,i) => {
  const keepStr = v.outerHTML;
  stringify = stringify.replace(`_k${i}_`, keepStr);
});

console.log(stringify);

如果有任何误导，请让我发表评论。

Answer 2

如果日期和车辆的div和class来自另一个功能，则应从那里删除它。