在 JavaScript 中使用 for 循环更改 H1

Question

这里是 JS 新手。我正在尝试获取 H1 标签中的所有值并更改长度小于 4 的值。

它说“请回答问题”我需要它说“请回答你好问题”

let header = document.getElementById("h1").innerHTML;
let splittedText = header.split(" ");

function seperateText() {
  for (let i = 0; i < splittedText.length; i++) {
    if (splittedText[i].length < 4) {

      splittedText[i].innerHTML = "Hello"
    }
  }
  // console.log(splittedText[i]);
  return splittedText[i].innerHTML;
}
seperateText();

<h1 id="h1">Please Answer the Questions</h1>

Answer 1

您的代码正在尝试设置字符串的 innerHTML - 这不起作用

而且[i]在循环外不存在

试试这张地图

const seperateText = str => {
  let splittedText = str.split(" ");
  return splittedText.map(word => word.length > 4 ? word : "hello").join(" ");
}

let header1 = document.getElementById("h1")
header1.innerHTML = seperateText(header1.innerHTML);

let header2 = document.getElementById("empty")
header2.innerHTML = seperateText(header2.innerHTML);

<h1 id="h1">Please Answer the Questions</h1>
<h1 id="empty"></h1>

或此替换

const seperateText = str => {
  return str.replace(/\b(\w+)\b/gi, match => match.length < 4 ? "hello" : match);
}

let header1 = document.getElementById("h1")
header1.innerHTML = seperateText(header1.innerHTML);

let header2 = document.getElementById("empty")
header2.innerHTML = seperateText(header2.innerHTML);

<h1 id="h1">Please Answer the Questions</h1>
<h1 id="empty"></h1>

在 JavaScript 中使用 for 循环更改 H1

Changing the H1 with for loop in JavaScript

javascript

dom

for-loop

innerhtml