如何根据从下拉菜单中选择的选项在HTML中显示文本？

<select id="mySelect">
  <option value="option1">选项1</option>
  <option value="option2">选项2</option>
  <option value="option3">选项3</option>
</select>

<p id="displayText"></p>

<script>
function displayText() {
  // 获取下拉菜单的选项
  var selectedOption = document.getElementById("mySelect").value;
  
  // 根据选择的选项设置要显示的文本
  var text = "";
  if (selectedOption === "option1") {
    text = "选项1被选择";
  } else if (selectedOption === "option2") {
    text = "选项2被选择";
  } else if (selectedOption === "option3") {
    text = "选项3被选择";
  }
  
  // 将文本显示在HTML元素中
  document.getElementById("displayText").innerText = text;
}
</script>

<select id="mySelect" onchange="displayText()">
  ...
</select>