如何索引select标签？jQuery操作select报错及遍历需求咨询

我来帮你拆解一下问题，你遇到的报错其实是个很常见的jQuery新手坑——当你用$(".selectExample")[3]这种方式取元素时，得到的是原生DOM对象，而不是jQuery包装后的对象，原生DOM元素没有jQuery的hide()方法，所以才会报错。

正确的索引方式（获取jQuery对象） #

如果你想对第4个（因为索引从0开始）.selectExample元素调用jQuery方法，有两种常用方式：

• 使用.eq()方法（推荐）：这是jQuery专门用来按索引筛选元素的方法，返回的是jQuery对象，能直接调用hide()、find()等方法：

  $(".selectExample").eq(3).hide();
  

• 把原生DOM转成jQuery对象：如果已经拿到了原生元素，用$()包裹它就能转成jQuery对象：

  $($(".selectExample")[3]).hide();
  

遍历select下option的正确写法 #

你的需求是遍历.selectExample下的option元素，要注意选择器的正确性（你原来的$('selectExample > option')少了.，因为是class选择器），结合索引的话可以这样写：

1. 遍历所有.selectExample下的option：

   $(".selectExample option").each(function(index, element) {
       // 这里的this或element都是当前的option原生DOM对象
       console.log($(this).text()); // 转成jQuery对象操作
   });
   

2. 只遍历指定索引的.selectExample下的option（比如第4个select）：

   $(".selectExample").eq(3).find("option").each(function() {
       // 处理当前select下的每个option
       console.log($(this).val());
   });
   

额外说明 #

不需要用span包裹select来实现hide()，只要确保操作的是jQuery对象而非原生DOM元素，就能直接调用jQuery的方法。记住：jQuery选择器返回的是一个类数组的jQuery集合，用方括号取索引会拿到原生元素，用.eq()则保持jQuery对象的特性。

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