Question

我有这个字符串，基本上是HTML模板，值得一提：

lkmlsdkmlskdmflsdk AGAndréèêÜÄÖß_Güntheräö laksmlaksm lkmalskamlskmaldksml

并且我正在使用此regex函数删除提及的HTML并更改提及的ID，因此，我应该返回以下字符串：

lkmlsdkmlskdmflsdk {mentionuser=cxid5024056} laksmlaksm kmalskamlskmaldksml

结果是我得到了：

asñald,ñsdl, {mentionuser=cxid5024056}" data-initials="AG" data-name="AndréèêÜÄÖß_Güntheräö laksmlaksm kmalskamlskmaldksml

为此，我正在使用此功能替换提及ID格式的提及HTML：

替换提及功能

public replaceMention(text: string): string {
    if (!text) {
      return '';
    }
    const contentMention = text.split(/(cxid[0-9]{1,8})/);
    for (let index = 0; index < contentMention.length; index++) {
      if (contentMention[index].match(/<span[^>]*id="/)) {
        contentMention[index] = contentMention[index].replace(/<span[^>]*id="/, '');
      }
      if (contentMention[index].match(/">[^>]*<span[^>]*><[^>]*>(<img[^>]*>)?(<span[^>]*><[^>]*>[^>]*<[^>]*><\/span>)?([^>]*)?(([a-zA-Z\-_.äöüéèêÜÄÖß etc]+)?\s?[a-zA-Z\-_.äöüéèêÜÄÖß etc]+?_[a-zA-Z\-_.äöüéèêÜÄÖß etc]+)([^>]*)?(<[^>]*><[^>]*>)?<\/span>[^>]*<\/span>(&nbsp;)?/)) {
        contentMention[index] = contentMention[index].replace(
          /">[^>]*<span[^>]*><[^>]*>(<img[^>]*>)?(<span[^>]*><[^>]*>[^>]*<[^>]*><\/span>)?([^>]*)?(([a-zA-Z\-_.äöüéèêÜÄÖß etc]+)?\s?[a-zA-Z\-_.äöüéèêÜÄÖß etc]+?_[a-zA-Z\-_.äöüéèêÜÄÖß etc]+)([^>]*)?(<[^>]*><[^>]*>)?<\/span>[^>]*<\/span>(&nbsp;)?/g,
          ''
        );
      }
      if (contentMention[index].match(/^(cxid[0-9]{1,8})$/)) {
        if (contentMention[index - 1].includes('{mentionuser=') || contentMention[index - 1] === undefined) {
          //
        } else {
          contentMention[index] = `{mentionuser=${contentMention[index]}}`;
        }
      }
    }
    let content = contentMention.join('').trim();
    console.log('====', content);
    return content;
  }

在Chrome中，Firefox可以正常工作，但是在Edge中，Internet Explorer不起作用。知道是什么原因吗？

Answer 1

您可以通过将字符串解析为DOM而不是使用正则表达式来减轻头痛：

function replaceMention(text) {
  if (!text) {
    return '';
  }

  //parse the template
  const parser = new DOMParser();
  const doc = parser.parseFromString(text, "text/html");

  //select ID that starts with `cxid`
  const mentionData = doc.querySelector('[id^="cxid"]');

  //get the user id
  const user = mentionData.id;

  //replace the span with the data for the user
  const replacement = document.createTextNode("{mentionuser=" + user + "}");
  mentionData.parentNode.replaceChild(replacement, mentionData);

  // return the new template
  const content = doc.body.innerHTML;
  return content;
}


const input = '<p>lkmlsdkmlskdmflsdk <span class="mention-user" data-initials="AG" data-name="AndréèêÜÄÖß_Güntheräö" id="cxid5024056"><span contenteditable="false"><!----><span class="initials"><!---->AG<!----></span>AndréèêÜÄÖß_Güntheräö<!----><!----></span></span> laksmlaksm lkmalskamlskmaldksml</p>';

const result = replaceMention(input);

console.log(result);

Javascript Regex在Edge中出现故障，但可以在所有其他浏览器中使用

1 个答案: