Question

我需要帮助来清理用户提供的HTML文本。我有以下HTML代码：

var htmlStr = `<p id="test" class="mydemo">TEhis is test</p>
   <pre class="css">
      &lt;html>
          &lt;body class="test">&lt;/body>
      &lt;/html>
   </pre>`;

我想使用普通JavaScript从所有其他标签中删除ID，Class或任何属性，然后从<PRE>和<CODE>标签中删除。

我尝试了以下操作，但未获得正确的输出：

sanitizeHtml(html: any) {
    let temp = document.createElement('div');
    temp.innerHTML = html;
    // let t1 = temp.querySelectorAll('*');

    temp.querySelectorAll('*').forEach(node => {
        if(node.nodeName !== 'PRE') {
            return node.removeAttribute('id');
        }
    })

    console.log(temp);

    // return html.replace(/\s*(\w+)=\"[^\"]+\"/gim, '').replace(/<script>[\w\W\s\S]+<\/script>/gim);
}

如果您需要更多信息，请告诉我。

Answer 1

这有点机械性，也许不是最佳解决方案，但是您可以通过将.replace()与以下正则表达式链接以根据需要清理HTML字符串来实现此目的：

   
function sanitizeHtml(html) {

  var htmlSanitized = html
  .replace(/<pre[\w\s"=]*>/gi, function(match) { 
      // Add a place holder to attrbitues on pre elements to prevent
      // removal of these in subsequent step
      return match.replace(/=/gi, 'EQUALS')
  })
  .replace(/\w+="\w+"/gi,'')
  .replace(/\s+>/gi,'>')
  .replace(/EQUALS/i,'=')

  return htmlSanitized;
}

var htmlStr = `<p id="test" class="mydemo">TEhis is test</p>
   <pre class="css">
      &lt;html>
          &lt;body class="test">&lt;/body>
      &lt;/html>
   </pre>`;

console.log(sanitizeHtml(htmlStr));

JavaScript清理HTML字符串并删除ID，类和其他属性

1 个答案: