求助：实现SELECT-OPTION标签实时改变textarea字体大小

嘿，我帮你看看这个问题～你原来的myFunction里有两个关键错误，导致没法正常工作：

• 误用了document.write()，这个方法会直接清空并覆盖整个页面内容，根本没法修改已经存在的textarea元素
• 代码里的txt变量完全没定义，而且fontsize()也不是修改DOM元素样式的正确方法

下面是修复后的完整代码，直接就能实现选择字体大小时实时改变两个textarea的字体大小：

<!-- HTML部分 -->
<select id="textareafontsize" onchange="myFunction()">
  <option value="12">12px</option>
  <option value="16">16px</option>
  <option value="20">20px</option>
  <option value="24">24px</option>
</select>

<textarea id="input" placeholder="输入内容"></textarea>
<textarea id="output" placeholder="输出内容"></textarea>

<script>
// 修复后的JS函数
function myFunction() {
  // 获取两个textarea元素
  const inputField = document.getElementById('input');
  const outputField = document.getElementById('output');
  // 获取选中的字体大小值
  const fontSize = document.getElementById("textareafontsize").value;
  
  // 给两个textarea设置字体大小，注意加上px单位
  inputField.style.fontSize = `${fontSize}px`;
  outputField.style.fontSize = `${fontSize}px`;
}
</script>

代码说明： #

• 给select标签绑定了onchange事件，每次选择不同选项时都会触发myFunction
• 通过document.getElementById()获取到目标元素后，直接修改它们的style.fontSize样式属性
• 用模板字符串${fontSize}px把数值和单位拼接起来，确保样式能正确生效

内容的提问来源于stack exchange，提问作者Arbnor Grezda