如何修剪js中的html內容？

Question

我有一個 contenteditable div，我想在將他的內容發送到服務器之前刪除開頭和結尾的空行和空格。 我在這里閱讀了一些答案，但沒有找到我想要的。 我想通過在開始和結束時刪除空格（如nbsp; ）來做與trim功能相同的功能，但也刪除空行（這意味着空塊為<div></div>或<br>或<div><br></div>等等...）

下面是一些例子：

<div><br></div><div>Hello</div><div>World</div><div><br></div></div>

應該

<div>Hello</div><div>World</div>

並且

&nbsp;<div><br></div><div>Hello</div><div></div><div>World</div>&nbsp;&nbsp;

應該

<div>Hello</div><div></div><div>World</div>

等等...

請問怎么做？

Answer 1

這是您要查找的內容，使用for loop 、 innerHTML和outerHTML屬性。

 function trimHTML(t) { var between = false; var outHTML = ""; for (var i = 0; i < t.childNodes.length; i++) { var lt = t.childNodes[i]; //console.log(lt.innerHTML) var nowset = false; if (lt.innerHTML != undefined && lt.innerHTML != "" && lt.innerHTML != "<br>") { between = !between; nowset = true; outHTML += lt.outerHTML; } if (between && !nowset) { outHTML += lt.outerHTML; } } return outHTML; } var t = document.querySelector("#t"); var result = document.querySelector("#result"); t.innerHTML = "<div></div><div></div><div><br></div><div>Hello</div><div>World</div><div><br></div></div>"; result.value = "---TEST1: \\nfrom:\\n" + t.innerHTML + "\\nto:\\n" + trimHTML(t); t.innerHTML = "&nbsp;<div><br></div><div>Hello</div><div></div><div>World</div>&nbsp;&nbsp;"; result.value += "\\n---TEST2: \\nfrom:\\n" + t.innerHTML + "\\nto:\\n" + trimHTML(t);

 <div id="t"> </div> <textarea id="result" style="width: 100%;min-height:90px;"> </textarea>