如何在javascript中增加btn

Question

// 컬러리스트 선택자 변수
const year = document.querySelector("#copy .year");
const bgColor = document.querySelector("#color_bg");
const bgInnerTitle = document.querySelector("#color_bg h1");
const bgInnerText = document.querySelector("#color_bg p");


// 컬러리스트
const bgText = [
  { 
    year : year.innerText = "2017",
    color: bgInnerTitle.innerText = "Greenery",
    number: bgInnerText.innerText = "15-0343",
    bg: bgColor.style.backgroundColor = "#84bd00"
  },
  {
    year : year.innerText = "2018",
    color: bgInnerTitle.innerText = "Ultra Violet",
    number: bgInnerText.innerText = "18-3838",
    bg: bgColor.style.backgroundColor = "#5f4b8b"
  },
  {
    year : year.innerText = "2019",
    color: bgInnerTitle.innerText = "Living Coral",
    number: bgInnerText.innerText = "16-1546",
    bg: bgColor.style.backgroundColor = "#FF6D70"
  },
  {
    year : year.innerText = "2020",
    color: bgInnerTitle.innerText = "Classic Blue",
    number: bgInnerText.innerText = "19-4052",
    bg: bgColor.style.backgroundColor = "#004680"
  }
];


// 버튼
const increase = document.querySelector("#btn .increase");
const decrease = document.querySelector("#btn .decrease");

// 감소버튼
decrease.addEventListener("click", function decreaseYear(event){
  let i = 3;
  bgText[i -1];
  console.log('hi');
});

// 증가버튼
increase.addEventListener("click", function increaseYear(){
  console.log('hello');
});

你知道如何使增加按钮起作用吗？

我想在我按下按钮时改变它

Answer 1

如果我对您的问题的理解是正确的，那么您正在尝试更改您使用查询选择器选择的 4 个标签中的所有内容。 如果这就是你想要做的，我认为你应该单独编辑它们。

就像你减少 fn 一样：

i--; // initialse i outside
year.innerHTML = bgText[i].year;
bgInnerTitle.innerHTML = bgText[i].color;
...

检查这些问题：

html - Change the Value of h1 Element within a Form with JavaScript - Stack Overflow

background color - How to use JavaScript to change div backgroundColor - Stack Overflow

以及类似的问题，关于如何使用JS更改HTML属性然后一一做。