如何删除Javascript中的某个空格而不是所有空格

Question

我正在尝试删除一些字符以及空白。 字符串是这样的：

<table id="myTable"><br/> <tbody><br/> <tr><br/> <td>1</td><br/> <td>1</td><br/> </tr><br/> <tr><br/> <td>1</td><br/> <td>1</td><br/> </tr><br/> <tr><br/> <td>1</td><br/> <td>1</td><br/> </tr><br/> <tr><br/> <td>2</td><br/> <td>2</td><br/> </tr><br/> <tr><br/> <td>2</td><br/> <td>2</td><br/> </tr><br/> <tr><br/> <td>2</td><br/> <td>2</td><br/> </tr><br/> <tr><br/> <td>3</td><br/> <td>3</td><br/> </tr><br/> <tr><br/> <td>3</td><br/> <td>3</td><br/> </tr><br/> <tr><br/> <td>3</td><br/> <td>3</td><br/> </tr><br/> </tbody> <br/></table>

我只想删除<br/>及其后的空格。 然后使用此代码逐行拆分，因为它是HTML table元素。

var table = document.getElementById("myTable").outerHTML
var linebyline = table2.match(/[^\r\n]+/g);

然后用for循环

var oneline = "", i = 0
for (lines in linebyline ){
    oneline += linebyline [lines].replace(/<br\/>\s/g,"")
}

我期望删除<br/>和空白，但是oneline的输出是：

<table id="myTable"> <tbody> <tr> <td>1</td> <td>1</td> </tr> <tr> <td>1</td> <td>1</td> </tr> <tr> <td>1</td> <td>1</td> </tr> <tr> <td>2</td> <td>2</td> </tr> <tr> <td>2</td> <td>2</td> </tr> <tr> <td>2</td> <td>2</td> </tr> <tr> <td>3</td> <td>3</td> </tr> <tr> <td>3</td> <td>3</td> </tr> <tr> <td>3</td> <td>3</td> </tr> </tbody> </table> 

空白空间仍然存在。 如何使用<br/>及其后的空格删除所有子字符串？

Answer 1

这是一种使用DOM操作的方法：

 const table = document.querySelector("#myTable"); Array.from(table.querySelectorAll("br")).forEach(br => br.remove()) let n; const textNodes = []; const walk = document.createTreeWalker(table, NodeFilter.SHOW_TEXT, null, false); while (n = walk.nextNode()) { textNodes.push(n); } textNodes.forEach(n => { if (!n.textContent.trim().length) { n.remove() } }) console.log(table.outerHTML) 

 <table id="myTable"><br/> <tbody><br/> <tr><br/> <td>1</td><br/> <td>1</td><br/> </tr><br/> <tr><br/> <td>1</td><br/> <td>1</td><br/> </tr><br/> <tr><br/> <td>1</td><br/> <td>1</td><br/> </tr><br/> <tr><br/> <td>2</td><br/> <td>2</td><br/> </tr><br/> <tr><br/> <td>2</td><br/> <td>2</td><br/> </tr><br/> <tr><br/> <td>2</td><br/> <td>2</td><br/> </tr><br/> <tr><br/> <td>3</td><br/> <td>3</td><br/> </tr><br/> <tr><br/> <td>3</td><br/> <td>3</td><br/> </tr><br/> <tr><br/> <td>3</td><br/> <td>3</td><br/> </tr><br/> </tbody> <br/></table> 

看来浏览器会删除<br />元素本身，至少Chrome会删除。

如果您只有一个字符串而不是DOM中的<table>元素，则仍可以通过使用DOMParser解析该字符串来使用此解决方案

Answer 2

您需要一个量词（例如+或* ）：

 let html = `<table id="myTable"><br/> <tbody><br/> <tr><br/> <td>1</td><br/> <td>1</td><br/> </tr><br/> <tr><br/> <td>1</td><br/> <td>1</td><br/> </tr><br/> <tr><br/> <td>1</td><br/> <td>1</td><br/> </tr><br/> <tr><br/> <td>2</td><br/> <td>2</td><br/> </tr><br/> <tr><br/> <td>2</td><br/> <td>2</td><br/> </tr><br/> <tr><br/> <td>2</td><br/> <td>2</td><br/> </tr><br/> <tr><br/> <td>3</td><br/> <td>3</td><br/> </tr><br/> <tr><br/> <td>3</td><br/> <td>3</td><br/> </tr><br/> <tr><br/> <td>3</td><br/> <td>3</td><br/> </tr><br/> </tbody> <br/></table>` html = html.replace(/<br\\/>\\s*/g, "") console.log(html)