Question

嗨，我的句子句子有问题。我有句子，我做一个循环来获取单词，然后将它们放在<li> -中，一个放在另一个下面。所以我又做了一个循环，只得到单词，然后放到li位置，但是在我的页面中，我只有一个单词。为什么会这样发生？

const wordText = document.createElement("div");
const lettersSection = document.querySelector(".letter");
        wordText.classList.add("wordText");
        lettersSection.appendChild(wordText);
        const jokeText = document.querySelectorAll(".random_joke h3");
        for (let el of jokeText) {
            const matchWords = el.textContent.match(/[a-z]+/gi);
            const changeSequenceWords = matchWords.sort(byLength);
            // const newString = changeSequenceWords.join(" ");
            for (let el of changeSequenceWords ) {
                const word = el;
                console.log(el)
                wordText.innerHTML = `<h4>Words:</h4><span><li>${word}</li></span>`
            }
            // const newString = changeSequenceWords.join(" ");

            // wordText.innerHTML = `<h4>Words:</h4><span>${newString} </span>`
        }

Answer 1

每次循环运行时，您要删除wordText.innerHTML的旧值-使用+=：

wordText.innerHTML += `<h4>Words:</h4><span><li>${word}</li></span>`

Answer 2

好的，我了解。我更改鳕鱼并创建新元素li。但是现在在控制台中，我用li（每一个词都是corect）有了所有单词，但是在html中，我有了“ [object HTMLLIElement]”

const jokeText = document.querySelectorAll(".random_joke h3");
const lettersSection = document.querySelector(".letter");
        for (let el of jokeText) {
            const matchWords = el.textContent.match(/[a-z]+/gi);
            const changeSequenceWords = matchWords.sort(byLength);
            for (let el of changeSequenceWords ) {
                const wordTextLi = document.querySelector(".wordText");

                const newLi = document.createElement("li");
                wordTextLi.appendChild(newLi);
                newLi.innerHTML = el;

                console.log(newLi)
                wordTextLi.innerHTML = `<h4>Words:</h4>${newLi}`
            }
        }

如何从另一个js下面的句子中设置单词

2 个答案: