Question

我的标签里面有一些可靠的内容。我希望能够使用javascript srt.replace()删除该标记及其所有内容。

我通常会使用像jQuery('.tag-class').remove()这样的东西，但在这种情况下jQuery不是一个选项。

我相信一个正则表达式是我正在寻找的东西，但经过一段时间的探索之后，我并不比我开始时更接近。

我需要这样做。

var myContent = 'bla bla bla <div class="remove-me">variable content here</div> something something';
// run some cool replace() here and get
// bla bla bla  something something

任何建议都会很棒！

Answer 1

如果方案是这样的，您可以简单地使用vanilla JavaScript DOM修改：

HTML：

<div id="abc">bla bla bla <div class="remove-me">variable content here</div> something something</div>

JavaScript的：

var container = document.getElementById("abc"),
    items = container.getElementsByClassName("remove-me"),
    i = 0,
    len = items.length;

for( ; i < len; i++ ) {
    items[i].parentNode.removeChild(items[i]);
}

或者如果要删除所有HTML标记：

var container = document.getElementById("abc");

container.innerHTML = container.innerHTML.replace(/(<([^>]+)>)/ig,"");

Answer 2

不要使用正则表达式来修改HTML。

HTML旨在由解析器解析，正则表达式（本身）不擅长解析文档标记。最好将HTML作为DIV或类似元素的innerHTML插入，然后使用DOM方法修改内容。

然后，您可以将DIV的内容作为节点插入到文档中，或者获取innerHTML并插入它。

e.g。

function removeElementsFromMarkup(markup, selector) {
  var el = document.createElement('div');
  el.innerHTML = markup;
  var nodes = el.querySelectorAll(selector);

  for (var i=0, iLen=nodes.length; i<iLen; i++) {
    node = nodes[i]
    if (node.parentNode) {
      node.parentNode.removeChild(node);
    }
  }
  return el.innerHTML;
}


alert( removeElementsFromMarkup(
  '<div>foo<div class="remove-me">bar</div></div>', '.remove-me') // <div>foo</div>
);

以上使用querySelectorAll，但您应该使用适合的任何选择方法。如果能完成这项工作，请选择最小公分母（例如getElementsByTagName）。

如果您展示了您要做的事情的真实示例，您将获得更具体（可能更有用）的答案。

Answer 3

var myContent = 'bla bla bla <div class="remove-me">variable content here</div> something something';
myContent = myContent.replace(/<div[\s\w"\=-]*class="remove-me"[\s\w"\=-]*>[\s\w]*<\/div>/g, "");
alert(myContent);

https://jsfiddle.net/umL1tswn/

JavaScript.replace（），删除标记和内容

3 个答案: