• html 动态设置下拉选项

            在HTML中，如果你想动态设置下拉选项（`元素中。
            如果你想在用户交互（如点击按钮）后动态添加选项，你可以将上述代码放入一个事件处理函数中：
            

    1. <button id="addOptions">添加选项</button>
    2. <script>
    3. document.addEventListener('DOMContentLoaded', function() {
    4.   document.getElementById('addOptions').addEventListener('click', function() {
    5.     var selectElement = document.getElementById('mySelect');
    6.     var option1 = document.createElement('option');
    7.     option1.value = 'value1';
    8.     option1.text = '选项 1';
    9.     selectElement.add(option1);
    10.   });
    11. });
    12. </script>


            在这个例子中，当用户点击按钮时，一个新的

    1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4. <meta charset="UTF-8">
    5. <title>动态清除下拉选项示例</title>
    6. <script>
    7. // 这个函数将在文档加载完成后执行
    8. document.addEventListener('DOMContentLoaded', function() {
    9.   // 获取<select>元素
    10.   var selectElement = document.getElementById('mySelect');
    11.   // 清除<select>元素中的所有<option>子元素
    12.   selectElement.innerHTML = '';
    13. });
    14. </script>
    15. </head>
    16. <body>
    17. <!-- 下拉菜单 -->
    18. <select id="mySelect">
    19.   <option value="value1">选项 1</option>
    20.   <option value="value2">选项 2</option>
    21.   <option value="value3">选项 3</option>
    22. </select>
    23. </body>
    24. </html>

  • 相关阅读:
    软件测试基本常识
    【牛客刷题】前端--JS篇（一）
    向AI提问，我是怎么做的？
    rails的接口查询详解
    Soc系统级芯片
    《SQLi-Labs》04. Less 23~28a
    那些提前半年用好 AI 的职场人，收获了什么？
    oracle中使用rownum作为条件的失效问题的原因和解决方法
    自动驾驶和辅助驾驶系统的概念性架构(一)
    Notepad++插件 Hex-Edit
  • 原文地址：https://blog.csdn.net/u013558123/article/details/136159746