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

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

JS函數(shù)如果重復(fù)則不會改變HTML文本的顏色

JS函數(shù)如果重復(fù)則不會改變HTML文本的顏色

拉風(fēng)的咖菲貓 2023-08-29 10:24:27
我很難為這個問題選擇一個標(biāo)題,但我會盡力在下面解釋。我制作了這個檢查器,它可以一一檢查輸入的單詞,如果單詞輸入正確,它會將顏色更改為綠色。它通過將輸入拆分為單獨的單詞并將其放入數(shù)組中來實現(xiàn)。但我看到的是,如果我將輸入單詞與文本中的重復(fù)單詞進(jìn)行比較,它不會改變顏色。為什么會這樣呢?我看到更改顏色的函數(shù)采用的是單詞在數(shù)組中的位置,而不是其值,然后簡單地添加 html 元素的顏色。let text = document.querySelector('.card-body').innerHTML;let splitText = text.split(' ');let userInput = document.querySelector('.form-control');userInput.addEventListener('input', acceptInput)let correctWords = [];let mistakes = 0;let words = [];function acceptInput() {    userInput.onkeydown = function(e){        if(e.keyCode == 32){            words = userInput.value.split(' ');                    console.log(words);             console.log(splitText);            let position = words.length-1;            compareWordsArrays(position);        }    }}function compareWordsArrays(position) {        for(i = position; i < words.length; i++) {        if(words[i] === splitText[i]) {            console.log(`Correct word detected: ${words[i]}`);            let wordIndex = words.indexOf(words[i]);            changeColor(wordIndex);        } else {            console.log('Incorrect word;');            mistakes += 1;            console.log(mistakes);                    }    }    }function changeColor(pos) {    splitText[pos]="<font color=green>"+splitText[pos]+"</font>";    let c = splitText.join(' ');    document.querySelector('.card-body').innerHTML = c;} <div class="card">    <div class="card-body">Random text that appears from some generator or some stuff. But it needs to have quite few text, actually.     </div></div><input type="text" class="form-control">在我的示例中,您可以看到單詞“some”在句子中重復(fù)兩次,而第二個單詞“some”沒有被更改,盡管它不將第二個單詞算作錯誤,我也不希望我說得足夠清楚。
查看完整描述

2 回答

?
肥皂起泡泡

TA貢獻(xiàn)1829條經(jīng)驗 獲得超6個贊

只是改變


if(words[i] === splitText[i]) {

        console.log(`Correct word detected: ${words[i]}`);

        let wordIndex = words.indexOf(words[i]);

        changeColor(wordIndex);


    }


if(words[i] === splitText[i]) {

        console.log(`Correct word detected: ${words[i]}`);

        changeColor(i);


    }

作為:

  • 尋找您已經(jīng)知道的索引是沒有意義的(i在這種情況下)

  • indexOf 僅返回第一次出現(xiàn)的索引,因此您的腳本僅適用于第一次出現(xiàn)...


查看完整回答
反對 回復(fù) 2023-08-29
?
Helenr

TA貢獻(xiàn)1780條經(jīng)驗 獲得超4個贊

indexOf()將為您提供值出現(xiàn)的第一個索引。

因此,如果您的數(shù)組包含重復(fù)的單詞,您將找到第一次找到該單詞的索引,而不是重復(fù)單詞的索引。

.lastIndexOf()幸運的是,數(shù)組也有這個方法。

換成筆就可以了let wordIndex = words.indexOf(words[i]);let wordIndex = words.lastIndexOf(words[i]);


查看完整回答
反對 回復(fù) 2023-08-29
  • 2 回答
  • 0 關(guān)注
  • 168 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號

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