js操纵dom生成下拉列表框的方法

下面是JS操纵DOM生成下拉列表框的方法的完整攻略：

1. 使用 createElement 方法创建下拉列表框

可以使用 JavaScript 的 createElement 方法动态创建 HTML 元素，从而实现生成下拉列表框。具体代码如下：

// 获取 HTML 元素
var myDiv = document.getElementById('myDiv');

// 创建下拉列表框
var selectListEl = document.createElement('select');

// 添加选项
var option1 = document.createElement('option');
var option2 = document.createElement('option');
option1.text = '选项1';
option2.text = '选项2';
selectListEl.add(option1);
selectListEl.add(option2);

// 将下拉列表框添加到页面中
myDiv.appendChild(selectListEl);

上述代码先获取了一个指定 ID 的 HTML 元素，然后使用 createElement 方法创建一个 select 元素，再使用 createElement 方法创建两个 option 元素作为下拉列表框的选项，最后使用 add 方法添加这两个选项，并将下拉列表框添加到页面中。

2. 使用 innerHTML 属性生成下拉列表框

除了使用 createElement 方法，我们还可以利用 innerHTML 属性生成下拉列表框。具体代码如下：

// 获取 HTML 元素
var myDiv = document.getElementById('myDiv');

// 创建下拉列表框
var selectList = '<select>';
selectList += '<option>选项1</option>';
selectList += '<option>选项2</option>';
selectList += '</select>';

// 将下拉列表框添加到页面中
myDiv.innerHTML = selectList;

上述代码使用了一个字符串变量，通过拼接字符串的方式生成了 select 和 option 元素，再将整个字符串赋值给指定的 HTML 元素的 innerHTML 属性，就把下拉列表框添加到了页面中。

总的来说，要生成一个下拉列表框，我们需要以下步骤：

1. 创建下拉列表框元素（可以使用 createElement 方法或 innerHTML 属性）；
2. 创建选项元素（可以使用 createElement 方法或字符串拼接）；
3. 将选项元素添加到下拉列表框中（可以使用 add 方法或字符串拼接）；
4. 将下拉列表框添加到页面中（可以使用 appendChild 方法或 innerHTML 属性）。

这些步骤可以根据实际需要进行调整和组合，以生成不同样式和功能的下拉列表框。