Question

如果我有以下内容：

content = "<a href=\"1\">I</a> was going here and then <a href=\"that\">that</a> happened."

如何完全删除标签，以便大字符串不再有任何锚标签？

我到目前为止：

var href = content.indexOf("href=\"");
var href1 = content.substring(href).indexOf("\"");

Answer 1

这就是为什么上帝发明了正则表达式，string.replace方法接受它作为要替换的字符串。

var contentSansAnchors = content.replace(/<\/?a[^>]*>/g, "");

如果你是regex的新手，可以解释一下：

/ ... /：不是将搜索字符串包装在引号中，而是用正斜杠包装它以反映正则表达式。

< ... >：这些是文字HTML标记括号。

\/?：标记可能会或可能不会（?）以正斜杠（\/）开头。必须使用反斜杠转义正斜杠，否则正则表达式将在此处提前结束。

a：文字锚标记名称。

[^>]*：在a之后，标记可能包含零个或多个（*）个字符，而不是（^）一个右括号（> }）。＆＃34;除了闭幕式之外的任何东西＆＃34;表达式用方括号（[ ... ]）包装，因为它代表单个字符。

g：这会将正则表达式修改为全局，以便替换所有匹配项。否则，只会替换第一个匹配。

根据您希望解析的字符串，您可能还希望为不区分大小写添加i修饰符。

Answer 2

您可以使用Regex替换所有锚标记。

var result = subject.replace(/<a[^>]*>|<\/a>/g, "");

Answer 3

删除所有标记，保留其文字内容：

var content = "<a href=\"1\">I</a> was going here and then <a href=\"that\">that</a> happened.";

// parse the HTML string into DOM
var container = document.createElement('div');
container.innerHTML = content;

// retrieve the textContent, or innerText when textContent is not available
var clean = container.textContent || container.innerText;
console.log(clean); //"I was going here and then that happened."

Fiddle

根据OP's comment，文本只包含锚标记，因此此方法应该可以正常工作。

如果您不需要IE＆lt; = 8支持，则可以删除|| container.innerText。

参考的

textContent - 获取或设置节点及其后代的文本内容。
innerText - 设置或检索对象的开始和结束标记之间的文本。

只是回答标题中的问题，这里只是删除锚元素的方法：

var content = "<a href=\"1\">I</a> was going here and then <a href=\"that\">that</a> happened.";

var container = document.createElement('div');
container.innerHTML = content;

var anchors = container.getElementsByTagName('a'),
    anchor;

while (anchor = anchors[0]) {
    var anchorParent = anchor.parentNode;

    while (anchor.firstChild) {
        anchorParent.insertBefore(anchor.firstChild, anchor);
    }
    anchorParent.removeChild(anchor);
}

var clean = container.innerHTML;
console.log(clean); //"I was going here and then that happened."

Fiddle

参考的

Node.insertBefore - 将指定节点作为当前节点的子元素插入引用元素之前。
Node.removeChild - 从DOM中删除子节点。
Element.getElementsByTagName - 返回具有给定标记名称的元素列表。搜索指定元素下面的子树，不包括元素本身。

即使OP没有使用jQuery，这里有一个与之相关的实际等效的jQuery版本：

var content = "<a href=\"1\">I</a> was going here and then <a href=\"that\">that</a> happened.";

var clean = $('<div>').append(content).find('a').contents().unwrap().end().end().html();
console.log(clean); //"I was going here and then that happened."

Fiddle

注

本回答中的所有解决方案都假设content是有效的HTML - 它不会处理格式错误的标记，未关闭的标记等。它还认为标记是安全的（XSS消毒）。

如果不符合上述标准，最好使用正则表达式解决方案。当用例涉及解析HTML时，正则表达式通常应该是你的最后手段，因为在针对任意标记测试时很容易中断（相关：virgin-devouring ponies），但是你的用例看起来非常简单，正则表达式可能只是解决方案你需要什么。

这个答案提供了非正则表达式解决方案，以便您可以使用这些（如果有的话）正则表达式解决方案。

Answer 4

如果你能以某种方式在javascript中获取你的字符串，如果不是动态的（比如你把它保存在一个名为＆＃34的var中;者替换字符串＆＃34;在javascript中），那么为了解决这个问题，你可以包含整个html内容在如下所示的div中： -

<div id="stringContent">
  <a href=\"1\">I</a> was going here and then <a href=\"that\">that</a> happened.
</div>

然后你可以通过jQuery执行： -

$("#stringContent").empty();
$("#stringContent").html(replacedString);

替换大字符串中的所有锚标记实例

4 个答案:

参考的

参考的

注