解析UL LI列表以逗號分隔的值

Question

我需要你的幫助，

現在，我的函數如下所示彈出我的UL LI列表：

Coffee ,Tea ,Milk

我需要將其轉換為以下格式：

Coffee,Tea,Milk

為什么要增加多余的空間？

function items_2_var() {

    var x = document.getElementById("list1").getElementsByTagName("li")

    var values = []

    for(var i=0;i < x.length; i++) {

        if (x[i].innerText.length) { values.push(x[i].innerText) }
    }

    alert(values.join(","))

}

HTML：

<div id="list1">
    <ul>
      <li>Coffee</li>
      <li>Tea</li>
      <li>Milk</li>
    </ul>
</div>

Answer 1

我可以重現您描述的問題的唯一方法是，如果最終得到的是這樣呈現的HTML：

<div id="list1">
    <ul>
      <li>Coffee&nbsp;&nbsp;&nbsp;&nbsp;</li>
      <li>Tea&nbsp;&nbsp;</li>
      <li>Milk&nbsp;&nbsp;&nbsp;</li>
    </ul>
</div>

在這種情況下，當您連接琴弦時，確實會看到空格。 但是，通過使用以下代碼可以輕松解決此問題： values.push((x[i].innerText.replace(/\\s/g,''))

碼：

function items_2_var() {
    var x = document.getElementById("list1").getElementsByTagName("li");
    var values = [];
    for(var i=0;i < x.length; i++) {
        if (x[i].innerText.length) { values.push((x[i].innerText.replace(/\s/g,''))); }
    }
    alert(values.join(","));
}

完整的演示在這里。