javascript - {li}之间有

Question

您好我正在尝试使用 DOM 显示一个数组。问题是我在 LI 元素之间得到了“，”。我怎样才能删除它？

const boresult = {
  success: ["max-length", "no-amd", "prefer-arrow-function"],
  failure: ["no-var", "var-on-top", "linebreak"],
  skipped: ["id-blacklist", "no-dup-keys"]
};

function makeList(arr) {
  const resultDisplayArray = [];
  for (let i = 0; i < arr.length; i++) {
    resultDisplayArray.push(`<li>${arr[i]}</li>`);
    // resultDisplayArray.push('<li style="color: red">' + arr[i] + '</li>');
  }
  return resultDisplayArray;
}

// document.getElementById('ba').innerHTML = makeList(boresult.success);
const resultDisplayArray = makeList(boresult.success);
document.getElementById('ba').innerHTML = resultDisplayArray;

这是一个屏幕截图：

标签： javascript

Answer 1

You could join the array with an empty string.

If you take just the array and the environment expect a string, then the toString method is called, which is basically the same as Array#join, but it takes a default string of , for joining.

To prevent this, you need to take an own parameter.

function makeList(array) {
    return array.map(v => `<li>${v}</li>`);
}

const boresult = { success: ["max-length", "no-amd", "prefer-arrow-function"], failure: ["no-var", "var-on-top", "linebreak"], skipped: ["id-blacklist", "no-dup-keys"] };

document.getElementById('ba').innerHTML = makeList(boresult.success).join('');

<ul id="ba"></ul>