Verwenden von Regex, um HTML in div zu ersetzen und Abstände hinzuzufügen

Question

Hallo, ich hätte gerne Hilfe beim Erstellen einer Regex, die alle HTML-Tags ersetzt, aber wenn das End-Div und das Start-Div nebeneinander liegen, wird ein Leerzeichen hinzugefügt, etwa so: is

a< /div>

test

Dies ist ein Test. Mein aktueller regulärer Ausdruck ist /(<([^>]+)>)/ig. Er ersetzt alle HTML-Tags, aber ich möchte wissen, wann es ein End-Di gibt

P粉296080076 · Answer

JS 内置了对 HTML 解析的支持。使用它来代替：

function getSpaceSeparatedText(html) {
  // Create an element and use it as a parser
  let parser = document.createElement('div');
  
  parser.innerHTML = html;
  
  const result = [];
  
  for (const node of parser.childNodes) {
    // Get the trimmed text
    const text = node.textContent.trim();
    
    // If text is not empty, add it to result
    if (text) {
      result.push(text);
    }
  }
  
  return result.join(' ');
}

尝试一下：

console.config({ maximize: true });

function getSpaceSeparatedText(html) {
  let parser = document.createElement('div');
  
  parser.innerHTML = html;
  
  const result = [];
  
  for (const node of parser.childNodes) {
    const text = node.textContent.trim();
    
    if (text) {
      result.push(text);
    }
  }
  
  return result.join(' ');
}

const html = `
This is 
a
test
`;

console.log(getSpaceSeparatedText(html));