Question

我想让代码不断变化，不要只执行一次。默认情况下，该按钮具有用于文本的深色模式，而背景色是粉红色。当您单击按钮时，背景颜色将为黑色，按钮中的文本将会是灯光模式。

我想在以浅色模式单击按钮时使用它，反之亦然。如何继续调用该函数？

function changeLight() {
  const btnTag = document.createElement('button');
  document.body.style.backgroundColor = "pink";
  btnTag.style.backgroundColor = "white";
  btnTag.textContent = "dark mode";
  btnTag.style.color = "black";

  btnTag.onclick = function() {
    if(btnTag.textContent = "light mode") {
        document.body.style.backgroundColor = "pink";
        btnTag.style.backgroundColor = "white";
        btnTag.textContent = "dark mode";
        btnTag.style.color = "black";
    }
    if(btnTag.textContent = "dark mode") {
        document.body.style.backgroundColor = "black";
        btnTag.style.backgroundColor = "gray";
        btnTag.textContent = "light mode";
        btnTag.style.color = "white";
    }
  }

  document.body.appendChild(btnTag);
};
changeLight();

Answer 1

您的if语句应与=比较，而不要与debugger()赋值。另外，在代码中放置else或breakpoint，然后一行一行地遍历代码。

然后您将看到代码进入了第二个单击后的第一个if语句，然后进入了第二个，因为您将文本更改为“暗模式”。

您需要在第二个if语句之前添加else if (btnTag.textContent == "dark mode") {：

function changeLight() {
  const btnTag = document.createElement('button');
  document.body.style.backgroundColor = "pink";
  btnTag.style.backgroundColor = "white";
  btnTag.textContent = "dark mode";
  btnTag.style.color = "black";

  btnTag.onclick = function() {
    if(btnTag.textContent == "light mode") { // CHANGED
        document.body.style.backgroundColor = "pink";
        btnTag.style.backgroundColor = "white";
        btnTag.textContent = "dark mode";
        btnTag.style.color = "black";
    }
    else if (btnTag.textContent == "dark mode") { // CHANGED
        document.body.style.backgroundColor = "black";
        btnTag.style.backgroundColor = "gray";
        btnTag.textContent = "light mode";
        btnTag.style.color = "white";
    }
  }

  document.body.appendChild(btnTag);
};
changeLight();

      freeStyleJob("SEED") {
        parameters {
          stringParam("MY_PARAMETER", "defaultValue", "A parameter")
        }

        steps {
          jobDsl {
            scriptText('''
            job("seedJOB") {
              displayName('${MY_PARAMETER}') // don't work
              description("${MY_PARAMETER}") // don't work
            //description("$MY_PARAMETER")   // don't work
            //description('$MY_PARAMETER')   // don't work
            // i tried to use triple full quotes instead of triple single quote but it's not working...

              ... here the job...
            '''.stripIndent())
          }
        }

Answer 2

如果条件不存在，则缺少“ ===”。我添加了else块，并且有效

{{1}}

Answer 3

您需要使用===或==进行比较，而不是=。您已在if条件中使用它。

这应该有效-

function changeLight() {
  const btnTag = document.createElement('button');
  document.body.style.backgroundColor = "pink";
  btnTag.style.backgroundColor = "white";
  btnTag.textContent = "dark mode";
  btnTag.style.color = "black";

  btnTag.onclick = function() {
    if(btnTag.textContent === "light mode") {
        document.body.style.backgroundColor = "pink";
        btnTag.style.backgroundColor = "white";
        btnTag.textContent = "dark mode";
        btnTag.style.color = "black";
    }
    if(btnTag.textContent === "dark mode") {
        document.body.style.backgroundColor = "black";
        btnTag.style.backgroundColor = "gray";
        btnTag.textContent = "light mode";
        btnTag.style.color = "white";
    }
  }

  document.body.appendChild(btnTag);
};
changeLight();

记住

=进行分配
==用于按值比较
===用于按类型和值进行比较

按下按钮时继续执行。 DOM

3 个答案: