JavaScript 按日显示 Profit/Loss

Question

我正在尝试根据字符串开头是否有负号来显示每天的利润或损失，但是这里肯定行不通...

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Long list</title>
</head>

<body>
  <ul>
    Profit/Loss by Day
    <li>-</li>
    <li></li>
    <li></li>
    <li></li>
    <li>[=12=]</li>
    <li>[=12=]</li>
    <li></li>
    <li>-</li>
    <li>-</li>
    <li>-</li>
  </ul>
  <script>
    let li = document.querySelectorAll('li');
    for (let i = 0; i < li.length; i++) {
      let p = document.createElement('p');
      if (li[i][0] == '-') {
        p.innerHTML = `Day ${i+1}, I lost ${li[i].innerHTML}`;
        document.body.append(p);
      } else {
        p.innerHTML = `Day ${i+1}, I earned ${li[i].innerHTML}`;
        document.body.append(p);
      }
    }
  </script>
</body>

</html>

Answer 1

您可以使用.innerHTML和.indexOf检查每个列表项内容中-的位置：

let li = document.querySelectorAll('li');
for (let i = 0; i < li.length; i++) {
     let p = document.createElement('p');
     if (li[i].innerHTML.indexOf('-') === 0) {
          p.innerHTML = `Day ${i+1}, I lost ${li[i].innerHTML}`;
          document.body.append(p);
     } else {
          p.innerHTML = `Day ${i+1}, I earned ${li[i].innerHTML}`;
          document.body.append(p);
     }
}

<ul>
    Profit/Loss by Day
    <li>-</li>
    <li></li>
    <li></li>
    <li></li>
    <li>[=11=]</li>
    <li>[=11=]</li>
    <li></li>
    <li>-</li>
    <li>-</li>
    <li>-</li>
</ul>

JavaScript 按日显示 Profit/Loss

JavaScript Display Profit/Loss by Day

javascript

loops

html-lists