第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

如何使按鈕在單擊時(shí)更改背景和文本顏色

如何使按鈕在單擊時(shí)更改背景和文本顏色

守候你守候我 2021-11-12 10:54:52
我正在嘗試創(chuàng)建一個(gè)按鈕來更改整個(gè)頁面的背景顏色和一些文本顏色,但我無法使其工作。背景目前正在工作,但文本不會(huì)改變顏色。我希望“changeText”影響類而不是 Id。我對(duì) JavaScript 的了解為零,所以很難知道出了什么問題。這是代碼:var colors = ["green", "red", "blue"];var colorIndex = 0;function changeText() {  var col = document.getElementsByClassname("textcolor");  if (colorIndex >= colors.length) {    colorIndex = 0;  }  col.body.style.color = colors[colorIndex];  colorIndex++;}var colors = ["red", "blue", "green"];var colorIndex = 0;function changeBackground() {  var col = document.getElementById("bodycolor");  if (colorIndex >= colors.length) {    colorIndex = 0;  }  col.style.backgroundColor = colors[colorIndex];  colorIndex++;}<body id='bodycolor'>  <h1 class="textcolor">Title Color Change</h1><br>  <p class="textcolor">Text Color Change </p><br>  <button type="button" onclick="changeBackground();changeText();">Click me</button></body>
查看完整描述

3 回答

?
汪汪一只貓

TA貢獻(xiàn)1898條經(jīng)驗(yàn) 獲得超8個(gè)贊

背景更改有效,因?yàn)?getElementById 只返回一個(gè)可以設(shè)置樣式屬性的元素。


getElementsByClassName() 但是返回一個(gè)項(xiàng)目集合。您將不得不迭代它并更改每個(gè)元素的樣式元素。嘗試這個(gè):


function changeText() {

  var col = document.getElementsByClassName("textcolor");

  if (colorIndex >= colors.length) {

    colorIndex = 0;

  }

for(var i = 0; i < col.length; i++){

  col[i].style.color = colors[colorIndex];

}

  colorIndex++;

}

此外,您不需要 .body 來設(shè)置樣式。


查看完整回答
反對(duì) 回復(fù) 2021-11-12
?
海綿寶寶撒

TA貢獻(xiàn)1809條經(jīng)驗(yàn) 獲得超8個(gè)贊

你為什么不給它唯一的 ID 并檢查它


  let colors = ["green", "red", "blue"];

    let colorIndex = 0;


    function changeBackground() {

      let col = document.getElementById("bodycolor");

      if (colorIndex >= colors.length) {

        colorIndex = 0;

      }

      col.style.backgroundColor = colors[colorIndex];

      colorIndex++;


       let h1Color = document.getElementById("h1Color")

       let pColor = document.getElementById("pColor");


      if (colorIndex >= colors.length) {

        colorIndex = 0;

      }

      h1Color.style.color = colors[colorIndex];

      pColor.style.color = colors[colorIndex];

     colorIndex++;

    }

 <body id='bodycolor'>

      <h1 id="h1Color">Title Color Change</h1><br>

      <p id="pColor">Text Color Change </p><br>

      <button type="button" onclick="changeBackground()">Click me</button>

    </body>


查看完整回答
反對(duì) 回復(fù) 2021-11-12
?
飲歌長(zhǎng)嘯

TA貢獻(xiàn)1951條經(jīng)驗(yàn) 獲得超3個(gè)贊

getElementsByClassName 返回包含提到的類名的所有元素的數(shù)組

嘗試

col[0].style.color = colors[colorIndex];

這是您的工作示例

訪問https://codepen.io/vikas_saini/pen/jOOErNZ


查看完整回答
反對(duì) 回復(fù) 2021-11-12
  • 3 回答
  • 0 關(guān)注
  • 247 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)