价值观严格相等的问题

Question

我是新来的编码人员，我正在为我必须制作的代码评分。 分级机非常挑剔，所以我对此有问题，所以顺序很重要，而现实世界中的事情并不重要。但是还是有一些问题。 我从 Javascript 创建了一个键盘，方法是创建按钮，为它们分配 innerText、一个 ID 并将它们一个接一个地放置。 这是我的代码。

let G4 = document.createElement ('button');
let sibemol = document.createElement ('button');
let C5 = document.createElement ('button');
let D5 = document.createElement ('button');
let F5 = document.createElement ('button');
let G5 = document.createElement ('button');

G4.innerHTML = '<button id="G4">G4</button>';
sibemol.innerHTML = '<button id="A#4">Bb4</button>';
C5.innerHTML = '<button id="C5">C5</button>';
D5.innerHTML = '<button id="D5">D5</button>';
F5.innerHTML = '<button id="F5">F5</button>';
G5.innerHTML = '<button id="G5">G5</button>';

G4.setAttribute('id', 'G4');
sibemol.setAttribute('id', 'A#4');
C5.setAttribute('id', 'C5');
D5.setAttribute('id', 'D5');
F5.setAttribute('id', 'F5');
G5.setAttribute('id', 'G5');

let keyboard = document.getElementById('simple-keyboard');
keyboard.appendChild(G4);
keyboard.appendChild(sibemol);
keyboard.appendChild(C5);
keyboard.appendChild(D5);
keyboard.appendChild(F5);
keyboard.appendChild(G5);

我遇到的问题是，首先 说“我应该有 6 个按钮”，它算我，因为我有 12 个，为什么它会加倍，我怎么能做到这一点，我在这里逐行发布（我有所有信息按钮一个按钮，但发现我必须按他们想要的顺序写行，显然-ik，这很糟糕。 然后，我有那个“按钮应该有 innerText Bb4 或 A#4”，我有这个消息： 表达式计算为假值：assert(note.indexOf(text) >= 0)

为什么会这样并且...我已经有那个内部文本了，所以我不知道是什么问题。

然后程序只是继续携带这些消息，好像事情的顺序是错误的，在我之前提到的两条消息之后： ⨯ 3. 按钮应该有 id-attribute C5 (3p) 期望值严格相等：'A#4' !== 'C5'

看起来，在我没有解决 Bb4 问题之前，我不会检查其余的代码 - 而且我只有 5 个可能的提交可以使用......

谢谢！

Answer 1

现在，您正在为每个按钮在按钮内创建一个按钮：

let C5 = document.createElement ('button');
C5.innerHTML = '<button id="C5">C5</button>';

这就像创造一些东西

<button><button id="C5">C5</button></button>

这就是造成问题的原因。

改为分配给您创建的按钮的id 和textContent 属性：

sibemol.id = 'A#4'; // you're already doing this with setAttribute below
sibemol.textContent = 'Bb4';
C5.id = 'C5';
C5.textContent = 'C5';
D5.id = 'D5';
D5.textContent = 'D5';
// etc

（不需要setAttribute，这是不必要的冗长）

或者，如果 ID 与 textContent 匹配，则重复次数更少：

const keys = ['G4', 'Bb4', 'C5', 'D5', 'F5', 'G5'];
for (const key of keys) {
  const button = keyboard.appendChild(document.createElement('button'));
  button.id = key;
  button.textContent = key;
}